قائمة منسدلة غاية في الروعه والجمال

 

 

 

خواني الاعزاء اثناء تجولي في النت عصرت على قوائم افقية منسدلة منفذة بشكل احترافي جدا لهذا قرر وضعها هنا حتى يستفيد منها اعضاء المدرسة الكرام

وهي منفذة بال css مع تأثير Jqeury و ال html

 

وهذا ملف ال css

رمز PHP:

 

<code><span style="color: black;"><span style="color: #0000bb;">body </span><span style="color: #007700;">{<br>    </span><span style="color: #0000bb;">background</span><span style="color: #007700;">:</span><span style="color: #ff8000;">#E5F0FF none repeat scroll 0 0;<br>    </span><span style="color: #0000bb;">color</span><span style="color: #007700;">:</span><span style="color: #ff8000;">#595959;<br>    </span><span style="color: #0000bb;">font</span><span style="color: #007700;">-</span><span style="color: #0000bb;">family</span><span style="color: #007700;"></span><span style="color: #0000bb;">Traditional Arabic</span><span style="color: #007700;"></span><span style="color: #0000bb;">Arial</span><span style="color: #007700;">;</span><span style="color: #0000bb;">text</span><span style="color: #007700;">-</span><span style="color: #0000bb;">align</span><span style="color: #007700;"></span><span style="color: #0000bb;">right</span><span style="color: #007700;">;<br>    </span><span style="color: #0000bb;">font</span><span style="color: #007700;">-</span><span style="color: #0000bb;">weight</span><span style="color: #007700;"></span><span style="color: #0000bb;">bold</span><span style="color: #007700;">;<br>    </span><span style="color: #0000bb;">font</span><span style="color: #007700;">-</span><span style="color: #0000bb;">size</span><span style="color: #007700;"></span><span style="color: #0000bb;">14px</span><span style="color: #007700;">;<br>}</span><span style="color: #0000bb;">ul</span><span style="color: #007700;"></span><span style="color: #0000bb;">li</span><span style="color: #007700;">{<br>    </span><span style="color: #0000bb;">padding</span><span style="color: #007700;"></span><span style="color: #0000bb;">0px</span><span style="color: #007700;">;<br>    </span><span style="color: #0000bb;">margin</span><span style="color: #007700;"></span><span style="color: #0000bb;">0px</span><span style="color: #007700;">;<br>}</span><span style="color: #0000bb;">ul</span><span style="color: #007700;">.</span><span style="color: #0000bb;">dropmenu</span><span style="color: #007700;">{<br>    </span><span style="color: #0000bb;">position</span><span style="color: #007700;"></span><span style="color: #0000bb;">relative</span><span style="color: #007700;">;<br>    </span><span style="color: #0000bb;">margin</span><span style="color: #007700;"></span><span style="color: #0000bb;">0px</span><span style="color: #007700;">;<br>    </span><span style="color: #0000bb;">padding</span><span style="color: #007700;"></span><span style="color: #0000bb;">1px 0px 0px 0px</span><span style="color: #007700;">;<br>    </span><span style="color: #0000bb;">background</span><span style="color: #007700;">:</span><span style="color: #0000bb;">transparent url</span><span style="color: #007700;">(</span><span style="color: #0000bb;">images</span><span style="color: #007700;">/</span><span style="color: #0000bb;">navigation</span><span style="color: #007700;">.</span><span style="color: #0000bb;">png</span><span style="color: #007700;"></span><span style="color: #0000bb;">repeat</span><span style="color: #007700;">-</span><span style="color: #0000bb;">x scroll 0 0</span><span style="color: #007700;">;<br>    </span><span style="color: #0000bb;">display</span><span style="color: #007700;">:</span><span style="color: #0000bb;">block</span><span style="color: #007700;">;<br>    </span><span style="color: #0000bb;">height</span><span style="color: #007700;"></span><span style="color: #0000bb;">35px</span><span style="color: #007700;">;<br>    </span><span style="color: #0000bb;">font</span><span style="color: #007700;">-</span><span style="color: #0000bb;">family</span><span style="color: #007700;"></span><span style="color: #0000bb;">Traditional Arabic</span><span style="color: #007700;"></span><span style="color: #0000bb;">Arial</span><span style="color: #007700;">;</span><span style="color: #0000bb;">text</span><span style="color: #007700;">-</span><span style="color: #0000bb;">align</span><span style="color: #007700;"></span><span style="color: #0000bb;">center</span><span style="color: #007700;">;<br>    </span><span style="color: #0000bb;">font</span><span style="color: #007700;">-</span><span style="color: #0000bb;">weight</span><span style="color: #007700;"></span><span style="color: #0000bb;">bold</span><span style="color: #007700;">;<br>    </span><span style="color: #0000bb;">font</span><span style="color: #007700;">-</span><span style="color: #0000bb;">size</span><span style="color: #007700;"></span><span style="color: #0000bb;">14px</span><span style="color: #007700;">;<br>}<br>.</span><span style="color: #0000bb;">dropmenu li</span><span style="color: #007700;">{<br>    </span><span style="color: #0000bb;">position</span><span style="color: #007700;"></span><span style="color: #0000bb;">relative</span><span style="color: #007700;">;<br>    list-</span><span style="color: #0000bb;">style</span><span style="color: #007700;"></span><span style="color: #0000bb;">none</span><span style="color: #007700;">;<br>    </span><span style="color: #0000bb;">float</span><span style="color: #007700;"></span><span style="color: #0000bb;">right</span><span style="color: #007700;">;<br>    </span><span style="color: #0000bb;">margin</span><span style="color: #007700;"></span><span style="color: #0000bb;">0px</span><span style="color: #007700;">;<br>    </span><span style="color: #0000bb;">padding</span><span style="color: #007700;"></span><span style="color: #0000bb;">0px</span><span style="color: #007700;">;<br>}<br>.</span><span style="color: #0000bb;">dropmenu li a</span><span style="color: #007700;">{<br>    </span><span style="color: #0000bb;">height</span><span style="color: #007700;"></span><span style="color: #0000bb;">22px</span><span style="color: #007700;">;<br>    </span><span style="color: #0000bb;">padding</span><span style="color: #007700;"></span><span style="color: #0000bb;">9px 30px 0px 15px</span><span style="color: #007700;">;<br>    </span><span style="color: #0000bb;">display</span><span style="color: #007700;"></span><span style="color: #0000bb;">block</span><span style="color: #007700;">;<br>    </span><span style="color: #0000bb;">cursor</span><span style="color: #007700;"></span><span style="color: #0000bb;">point</span><span style="color: #007700;">;<br>    </span><span style="color: #0000bb;">border</span><span style="color: #007700;">-</span><span style="color: #0000bb;">right</span><span style="color: #007700;"></span><span style="color: #0000bb;">solid 1px </span><span style="color: #ff8000;">#4a779d;<br>    </span><span style="color: #0000bb;">color</span><span style="color: #007700;"></span><span style="color: #ff8000;">#FFFFFF;<br>    </span><span style="color: #0000bb;">text</span><span style="color: #007700;">-</span><span style="color: #0000bb;">transform</span><span style="color: #007700;"></span><span style="color: #0000bb;">uppercase</span><span style="color: #007700;">;<br>    </span><span style="color: #0000bb;">text</span><span style="color: #007700;">-</span><span style="color: #0000bb;">decoration</span><span style="color: #007700;"></span><span style="color: #0000bb;">none</span><span style="color: #007700;">;<br>}<br>.</span><span style="color: #0000bb;">dropmenu li span</span><span style="color: #007700;">{<br>    </span><span style="color: #0000bb;">display</span><span style="color: #007700;"></span><span style="color: #0000bb;">block</span><span style="color: #007700;">;<br>    </span><span style="color: #0000bb;">float</span><span style="color: #007700;"></span><span style="color: #0000bb;">left</span><span style="color: #007700;">;<br>    </span><span style="color: #0000bb;">height</span><span style="color: #007700;"></span><span style="color: #0000bb;">10px</span><span style="color: #007700;">;<br>    </span><span style="color: #0000bb;">width</span><span style="color: #007700;"></span><span style="color: #0000bb;">10px</span><span style="color: #007700;">;<br>    </span><span style="color: #0000bb;">background</span><span style="color: #007700;">:</span><span style="color: #0000bb;">transparent url</span><span style="color: #007700;">(</span><span style="color: #0000bb;">images</span><span style="color: #007700;">/</span><span style="color: #0000bb;">arrow_up</span><span style="color: #007700;">.</span><span style="color: #0000bb;">png</span><span style="color: #007700;"></span><span style="color: #0000bb;">repeat</span><span style="color: #007700;">-</span><span style="color: #0000bb;">x scroll 0 0</span><span style="color: #007700;">;<br>    </span><span style="color: #0000bb;">position</span><span style="color: #007700;"></span><span style="color: #0000bb;">absolute</span><span style="color: #007700;">;<br>    </span><span style="color: #0000bb;">top</span><span style="color: #007700;"></span><span style="color: #0000bb;">12px</span><span style="color: #007700;">;<br>    </span><span style="color: #0000bb;">right</span><span style="color: #007700;"></span><span style="color: #0000bb;">10px</span><span style="color: #007700;">;<br>}<br>.</span><span style="color: #0000bb;">dropmenu li  a</span><span style="color: #007700;">:</span><span style="color: #0000bb;">hover span</span><span style="color: #007700;">{<br>    </span><span style="color: #0000bb;">background</span><span style="color: #007700;">:</span><span style="color: #0000bb;">transparent url</span><span style="color: #007700;">(</span><span style="color: #0000bb;">images</span><span style="color: #007700;">/</span><span style="color: #0000bb;">arrow_hover</span><span style="color: #007700;">.</span><span style="color: #0000bb;">png</span><span style="color: #007700;"></span><span style="color: #0000bb;">repeat</span><span style="color: #007700;">-</span><span style="color: #0000bb;">x scroll 0 0</span><span style="color: #007700;">;<br>}<br>.</span><span style="color: #0000bb;">dropmenu li</span><span style="color: #007700;">:</span><span style="color: #0000bb;">hover ul</span><span style="color: #007700;">, .</span><span style="color: #0000bb;">dropmenu li</span><span style="color: #007700;">:</span><span style="color: #0000bb;">hover div</span><span style="color: #007700;">{<br>    </span><span style="color: #0000bb;">display</span><span style="color: #007700;"></span><span style="color: #0000bb;">block</span><span style="color: #007700;">;<br>}<br>.</span><span style="color: #0000bb;">dropmenu ul</span><span style="color: #007700;">{<br>    </span><span style="color: #0000bb;">position</span><span style="color: #007700;"></span><span style="color: #0000bb;">absolute</span><span style="color: #007700;">;<br>    </span><span style="color: #0000bb;">display</span><span style="color: #007700;"></span><span style="color: #0000bb;">none</span><span style="color: #007700;">;<br>    </span><span style="color: #0000bb;">width</span><span style="color: #007700;"></span><span style="color: #0000bb;">140px</span><span style="color: #007700;">;<br>    </span><span style="color: #0000bb;">padding</span><span style="color: #007700;"></span><span style="color: #0000bb;">0px</span><span style="color: #007700;">;<br>    </span><span style="color: #0000bb;">margin</span><span style="color: #007700;"></span><span style="color: #0000bb;">0px</span><span style="color: #007700;">;<br>    </span><span style="color: #0000bb;">border</span><span style="color: #007700;">-</span><span style="color: #0000bb;">bottom</span><span style="color: #007700;"></span><span style="color: #0000bb;">1px solid </span><span style="color: #ff8000;">#ccc;<br>    </span><span style="color: #0000bb;">background</span><span style="color: #007700;"></span><span style="color: #ff8000;">#FFFFFF url(images/gradient.png) repeat-x scroll 0 0;</span><span style="color: #007700;">}<br>.</span><span style="color: #0000bb;">dropmenu ul li</span><span style="color: #007700;">{<br>    </span><span style="color: #0000bb;">border</span><span style="color: #007700;"></span><span style="color: #0000bb;">0</span><span style="color: #007700;">;<br>    </span><span style="color: #0000bb;">float</span><span style="color: #007700;"></span><span style="color: #0000bb;">none</span><span style="color: #007700;">;<br>}<br>.</span><span style="color: #0000bb;">dropmenu ul a </span><span style="color: #007700;">{<br>  </span><span style="color: #0000bb;">border</span><span style="color: #007700;"></span><span style="color: #0000bb;">1px solid </span><span style="color: #ff8000;">#ccc;<br>  </span><span style="color: #0000bb;">border</span><span style="color: #007700;">-</span><span style="color: #0000bb;">bottom</span><span style="color: #007700;"></span><span style="color: #0000bb;">0</span><span style="color: #007700;">;<br>  </span><span style="color: #0000bb;">white</span><span style="color: #007700;">-</span><span style="color: #0000bb;">space</span><span style="color: #007700;"></span><span style="color: #0000bb;">nowrap</span><span style="color: #007700;">;<br>  </span><span style="color: #0000bb;">display</span><span style="color: #007700;">:</span><span style="color: #0000bb;">block</span><span style="color: #007700;">;<br>  </span><span style="color: #0000bb;">color</span><span style="color: #007700;"></span><span style="color: #ff8000;">#0657AD;<br>  </span><span style="color: #0000bb;">text</span><span style="color: #007700;">-</span><span style="color: #0000bb;">decoration</span><span style="color: #007700;"></span><span style="color: #0000bb;">underline</span><span style="color: #007700;">;<br>  </span><span style="color: #0000bb;">text</span><span style="color: #007700;">-</span><span style="color: #0000bb;">transform</span><span style="color: #007700;"></span><span style="color: #0000bb;">none</span><span style="color: #007700;">;<br>}</span><span style="color: #0000bb;">a</span><span style="color: #007700;">.</span><span style="color: #0000bb;">selected</span><span style="color: #007700;"></span><span style="color: #0000bb;">a</span><span style="color: #007700;">:</span><span style="color: #0000bb;">hover</span><span style="color: #007700;">{<br>    </span><span style="color: #0000bb;">color</span><span style="color: #007700;"></span><span style="color: #ff8000;">#0657AD !important;<br>    </span><span style="color: #0000bb;">background</span><span style="color: #007700;"></span><span style="color: #ff8000;">#FFFFFF url(images/gradient.png) repeat-x scroll 0 0;</span><span style="color: #007700;">}</span><span style="color: #0000bb;">a</span><span style="color: #007700;">.</span><span style="color: #0000bb;">selected span</span><span style="color: #007700;">{<br>    </span><span style="color: #0000bb;">background</span><span style="color: #007700;">:</span><span style="color: #0000bb;">transparent url</span><span style="color: #007700;">(</span><span style="color: #0000bb;">images</span><span style="color: #007700;">/</span><span style="color: #0000bb;">arrow_hover</span><span style="color: #007700;">.</span><span style="color: #0000bb;">png</span><span style="color: #007700;"></span><span style="color: #0000bb;">repeat</span><span style="color: #007700;">-</span><span style="color: #0000bb;">x scroll 0 0</span><span style="color: #007700;">;<br>}<br>.</span><span style="color: #0000bb;">dropmenu ul a</span><span style="color: #007700;">:</span><span style="color: #0000bb;">hover </span><span style="color: #007700;">{<br>    </span><span style="color: #0000bb;">color</span><span style="color: #007700;">:</span><span style="color: #ff8000;">#F67A00 !important;<br>    </span><span style="color: #0000bb;">text</span><span style="color: #007700;">-</span><span style="color: #0000bb;">decoration</span><span style="color: #007700;"></span><span style="color: #0000bb;">none</span><span style="color: #007700;">;<br>    </span><span style="color: #0000bb;">background</span><span style="color: #007700;">-</span><span style="color: #0000bb;">color</span><span style="color: #007700;"></span><span style="color: #ff8000;">#F0F0F0;<br>    </span><span style="color: #0000bb;">background</span><span style="color: #007700;">-</span><span style="color: #0000bb;">image</span><span style="color: #007700;"></span><span style="color: #0000bb;">none</span><span style="color: #007700;">;<br>}<br>.</span><span style="color: #0000bb;">dropmenu div ul</span><span style="color: #007700;">{<br>    </span><span style="color: #0000bb;">position</span><span style="color: #007700;"></span><span style="color: #0000bb;">relative</span><span style="color: #007700;">;<br>    </span><span style="color: #0000bb;">display</span><span style="color: #007700;"></span><span style="color: #0000bb;">block</span><span style="color: #007700;">;<br>}<br>.</span><span style="color: #0000bb;">dropmenu li div</span><span style="color: #007700;">{<br>    </span><span style="color: #0000bb;">background</span><span style="color: #007700;"></span><span style="color: #ff8000;">#FFFFFF url(images/gradient.png) repeat-x scroll 0 0;<br>    </span><span style="color: #0000bb;">border</span><span style="color: #007700;"></span><span style="color: #0000bb;">1px solid </span><span style="color: #ff8000;">#ccc;<br>    </span><span style="color: #0000bb;">padding</span><span style="color: #007700;"></span><span style="color: #0000bb;">5px</span><span style="color: #007700;">;<br>    </span><span style="color: #0000bb;">display</span><span style="color: #007700;"></span><span style="color: #0000bb;">none</span><span style="color: #007700;">;<br>    </span><span style="color: #0000bb;">position</span><span style="color: #007700;"></span><span style="color: #0000bb;">absolute</span><span style="color: #007700;">;<br>}<br>.</span><span style="color: #0000bb;">dropmenu li div ul</span><span style="color: #007700;">{<br>    </span><span style="color: #0000bb;">border</span><span style="color: #007700;"></span><span style="color: #0000bb;">none</span><span style="color: #007700;">;<br>    </span><span style="color: #0000bb;">background</span><span style="color: #007700;"></span><span style="color: #0000bb;">none</span><span style="color: #007700;">;<br>    </span><span style="color: #0000bb;">position</span><span style="color: #007700;"></span><span style="color: #0000bb;">relative </span><span style="color: #007700;">!</span><span style="color: #0000bb;">important</span><span style="color: #007700;">;<br>}<br>.</span><span style="color: #0000bb;">dropmenu li div a</span><span style="color: #007700;">{<br>    </span><span style="color: #0000bb;">border</span><span style="color: #007700;"></span><span style="color: #0000bb;">none</span><span style="color: #007700;">;<br>    </span><span style="color: #0000bb;">border</span><span style="color: #007700;">-</span><span style="color: #0000bb;">bottom</span><span style="color: #007700;"></span><span style="color: #0000bb;">1px solid </span><span style="color: #ff8000;">#ccc;</span><span style="color: #007700;">}<br>.</span><span style="color: #0000bb;">dropmenu li div div</span><span style="color: #007700;">{<br>    </span><span style="color: #0000bb;">display</span><span style="color: #007700;"></span><span style="color: #0000bb;">block</span><span style="color: #007700;">;<br>    </span><span style="color: #0000bb;">position</span><span style="color: #007700;"></span><span style="color: #0000bb;">relative</span><span style="color: #007700;">;<br>    </span><span style="color: #0000bb;">background</span><span style="color: #007700;"></span><span style="color: #0000bb;">none</span><span style="color: #007700;">;<br>    </span><span style="color: #0000bb;">border</span><span style="color: #007700;"></span><span style="color: #0000bb;">none</span><span style="color: #007700;">;<br>}<br>.</span><span style="color: #0000bb;">dropmenu li div div a</span><span style="color: #007700;">{<br>    </span><span style="color: #0000bb;">display</span><span style="color: #007700;"></span><span style="color: #0000bb;">inline</span><span style="color: #007700;">;<br>    </span><span style="color: #0000bb;">border</span><span style="color: #007700;"></span><span style="color: #0000bb;">none</span><span style="color: #007700;">;<br>    </span><span style="color: #0000bb;">color</span><span style="color: #007700;"></span><span style="color: #ff8000;">#666;<br>    </span><span style="color: #0000bb;">text</span><span style="color: #007700;">-</span><span style="color: #0000bb;">decoration</span><span style="color: #007700;"></span><span style="color: #0000bb;">underline</span><span style="color: #007700;">;<br>    </span><span style="color: #0000bb;">padding</span><span style="color: #007700;"></span><span style="color: #0000bb;">0px</span><span style="color: #007700;">;<br>    </span><span style="color: #0000bb;">margin</span><span style="color: #007700;"></span><span style="color: #0000bb;">0px</span><span style="color: #007700;">;<br>    </span><span style="color: #0000bb;">text</span><span style="color: #007700;">-</span><span style="color: #0000bb;">transform</span><span style="color: #007700;"></span><span style="color: #0000bb;">none</span><span style="color: #007700;">;<br>}<br>.</span><span style="color: #0000bb;">dropmenu li div div a</span><span style="color: #007700;">:</span><span style="color: #0000bb;">hover</span><span style="color: #007700;">{<br>    </span><span style="color: #0000bb;">color</span><span style="color: #007700;"></span><span style="color: #ff8000;">#000;<br>    </span><span style="color: #0000bb;">text</span><span style="color: #007700;">-</span><span style="color: #0000bb;">decoration</span><span style="color: #007700;"></span><span style="color: #0000bb;">none</span><span style="color: #007700;">;<br>}</span><span style="color: #0000bb;">ul</span><span style="color: #007700;">.</span><span style="color: #0000bb;">left</span><span style="color: #007700;">{<br>    </span><span style="color: #0000bb;">float</span><span style="color: #007700;"></span><span style="color: #0000bb;">left</span><span style="color: #007700;">;<br>    </span><span style="color: #0000bb;">width</span><span style="color: #007700;"></span><span style="color: #0000bb;">145px</span><span style="color: #007700;">;<br>}</span><span style="color: #0000bb;">ul</span><span style="color: #007700;">.</span><span style="color: #0000bb;">right</span><span style="color: #007700;">{<br>    </span><span style="color: #0000bb;">float</span><span style="color: #007700;"></span><span style="color: #0000bb;">right</span><span style="color: #007700;">;<br>    </span><span style="color: #0000bb;">width</span><span style="color: #007700;"></span><span style="color: #0000bb;">145px</span><span style="color: #007700;">;<br>}<br>.</span><span style="color: #0000bb;">small</span><span style="color: #007700;">{<br>    </span><span style="color: #0000bb;">color</span><span style="color: #007700;"></span><span style="color: #ff8000;">#666;<br>    </span><span style="color: #0000bb;">font</span><span style="color: #007700;">-</span><span style="color: #0000bb;">size</span><span style="color: #007700;"></span><span style="color: #0000bb;">10px</span><span style="color: #007700;">;<br>    </span><span style="color: #0000bb;">padding</span><span style="color: #007700;"></span><span style="color: #0000bb;">10px 5px 8px 5px </span><span style="color: #007700;">!</span><span style="color: #0000bb;">important</span><span style="color: #007700;">;<br>    </span><span style="color: #0000bb;">display</span><span style="color: #007700;"></span><span style="color: #0000bb;">block</span><span style="color: #007700;">;<br>    </span><span style="color: #0000bb;">clear</span><span style="color: #007700;"></span><span style="color: #0000bb;">both</span><span style="color: #007700;">;<br>    </span><span style="color: #0000bb;">font</span><span style="color: #007700;">-</span><span style="color: #0000bb;">family</span><span style="color: #007700;"></span><span style="color: #0000bb;">Traditional Arabic</span><span style="color: #007700;"></span><span style="color: #0000bb;">Arial</span><span style="color: #007700;">;<br><br>    </span><span style="color: #0000bb;">font</span><span style="color: #007700;">-</span><span style="color: #0000bb;">weight</span><span style="color: #007700;"></span><span style="color: #0000bb;">bold</span><span style="color: #007700;">;<br>    </span><span style="color: #0000bb;">font</span><span style="color: #007700;">-</span><span style="color: #0000bb;">size</span><span style="color: #007700;"></span><span style="color: #0000bb;">13px</span><span style="color: #007700;">;<br>}<br>.</span><span style="color: #0000bb;">products</span><span style="color: #007700;">{<br>    </span><span style="color: #0000bb;">width</span><span style="color: #007700;"></span><span style="color: #0000bb;">300px</span><span style="color: #007700;">;<br>    </span><span style="color: #0000bb;">padding</span><span style="color: #007700;"></span><span style="color: #0000bb;">15px </span><span style="color: #007700;">!</span><span style="color: #0000bb;">important</span><span style="color: #007700;">;<br>}<br>.</span><span style="color: #0000bb;">products ul</span><span style="color: #007700;">{<br>    </span><span style="color: #0000bb;">width</span><span style="color: #007700;"></span><span style="color: #0000bb;">100</span><span style="color: #007700;">%;<br>}<br>.</span><span style="color: #0000bb;">products ul li</span><span style="color: #007700;">{<br>    </span><span style="color: #0000bb;">border</span><span style="color: #007700;">-</span><span style="color: #0000bb;">bottom</span><span style="color: #007700;"></span><span style="color: #0000bb;">1px solid </span><span style="color: #ff8000;">#ccc;<br>    </span><span style="color: #0000bb;">height</span><span style="color: #007700;"></span><span style="color: #0000bb;">40px</span><span style="color: #007700;">;<br>    </span><span style="color: #0000bb;">padding</span><span style="color: #007700;"></span><span style="color: #0000bb;">10px 0px</span><span style="color: #007700;">;<br>}<br>.</span><span style="color: #0000bb;">products h2</span><span style="color: #007700;">{<br>    </span><span style="color: #0000bb;">font</span><span style="color: #007700;">-</span><span style="color: #0000bb;">size</span><span style="color: #007700;"></span><span style="color: #0000bb;">16px</span><span style="color: #007700;">;<br>    </span><span style="color: #0000bb;">padding</span><span style="color: #007700;"></span><span style="color: #0000bb;">2px 0px 3px 0px</span><span style="color: #007700;">;<br>    </span><span style="color: #0000bb;">margin</span><span style="color: #007700;"></span><span style="color: #0000bb;">0px</span><span style="color: #007700;">;<br>}<br>.</span><span style="color: #0000bb;">products p</span><span style="color: #007700;">{</span><span style="color: #0000bb;">font</span><span style="color: #007700;">-</span><span style="color: #0000bb;">family</span><span style="color: #007700;"></span><span style="color: #0000bb;">Traditional Arabic</span><span style="color: #007700;"></span><span style="color: #0000bb;">Arial</span><span style="color: #007700;">;<br><br>    </span><span style="color: #0000bb;">font</span><span style="color: #007700;">-</span><span style="color: #0000bb;">weight</span><span style="color: #007700;"></span><span style="color: #0000bb;">bold</span><span style="color: #007700;">;<br><br>    </span><span style="color: #0000bb;">color</span><span style="color: #007700;"></span><span style="color: #ff8000;">#666;<br>    </span><span style="color: #0000bb;">font</span><span style="color: #007700;">-</span><span style="color: #0000bb;">size</span><span style="color: #007700;"></span><span style="color: #0000bb;">13px</span><span style="color: #007700;">;<br>    </span><span style="color: #0000bb;">padding</span><span style="color: #007700;"></span><span style="color: #0000bb;">0px</span><span style="color: #007700;">;<br>    </span><span style="color: #0000bb;">margin</span><span style="color: #007700;"></span><span style="color: #0000bb;">0px</span><span style="color: #007700;">;<br>}<br>.</span><span style="color: #0000bb;">products img</span><span style="color: #007700;">{<br>    </span><span style="color: #0000bb;">float</span><span style="color: #007700;"></span><span style="color: #0000bb;">right</span><span style="color: #007700;">;<br>    </span><span style="color: #0000bb;">padding</span><span style="color: #007700;">-</span><span style="color: #0000bb;">right</span><span style="color: #007700;"></span><span style="color: #0000bb;">10px</span><span style="color: #007700;">;<br>}<br>.</span><span style="color: #0000bb;">products  ul li a</span><span style="color: #007700;">{<br>    </span><span style="color: #0000bb;">display</span><span style="color: #007700;"></span><span style="color: #0000bb;">inline</span><span style="color: #007700;">;<br>    </span><span style="color: #0000bb;">border</span><span style="color: #007700;"></span><span style="color: #0000bb;">none</span><span style="color: #007700;">;<br>    </span><span style="color: #0000bb;">color</span><span style="color: #007700;"></span><span style="color: #ff8000;">#666;<br>    </span><span style="color: #0000bb;">text</span><span style="color: #007700;">-</span><span style="color: #0000bb;">decoration</span><span style="color: #007700;"></span><span style="color: #0000bb;">underline</span><span style="color: #007700;">;<br>    </span><span style="color: #0000bb;">padding</span><span style="color: #007700;"></span><span style="color: #0000bb;">0px</span><span style="color: #007700;">;<br>    </span><span style="color: #0000bb;">margin</span><span style="color: #007700;"></span><span style="color: #0000bb;">0px</span><span style="color: #007700;">;<br>    </span><span style="color: #0000bb;">text</span><span style="color: #007700;">-</span><span style="color: #0000bb;">transform</span><span style="color: #007700;"></span><span style="color: #0000bb;">none</span><span style="color: #007700;">;<br>}<br>.</span><span style="color: #0000bb;">products  ul li  a</span><span style="color: #007700;">:</span><span style="color: #0000bb;">hover</span><span style="color: #007700;">{<br>    </span><span style="color: #0000bb;">color</span><span style="color: #007700;"></span><span style="color: #ff8000;">#000 !important;<br>    </span><span style="color: #0000bb;">text</span><span style="color: #007700;">-</span><span style="color: #0000bb;">decoration</span><span style="color: #007700;"></span><span style="color: #0000bb;">none</span><span style="color: #007700;">;<br>    </span><span style="color: #0000bb;">background</span><span style="color: #007700;"></span><span style="color: #0000bb;">none </span><span style="color: #007700;">!</span><span style="color: #0000bb;">important</span><span style="color: #007700;">;<br>}<br><br>.</span><span style="color: #0000bb;">tutorials</span><span style="color: #007700;">{<br>    </span><span style="color: #0000bb;">width</span><span style="color: #007700;"></span><span style="color: #0000bb;">300px</span><span style="color: #007700;">;<br>}<br><br>.</span><span style="color: #0000bb;">login</span><span style="color: #007700;">{<br>    </span><span style="color: #0000bb;">padding</span><span style="color: #007700;"></span><span style="color: #0000bb;">15px </span><span style="color: #007700;">!</span><span style="color: #0000bb;">important</span><span style="color: #007700;">;<br>    </span><span style="color: #0000bb;">width</span><span style="color: #007700;"></span><span style="color: #0000bb;">180px</span><span style="color: #007700;">;<br>    </span><span style="color: #0000bb;">font</span><span style="color: #007700;">-</span><span style="color: #0000bb;">family</span><span style="color: #007700;"></span><span style="color: #0000bb;">Traditional Arabic</span><span style="color: #007700;"></span><span style="color: #0000bb;">Arial</span><span style="color: #007700;">;<br><br><div id="adsense_linepost"><ins class="adsbygoogle" data-ad-client="ca-pub-2994539583798950" data-ad-slot="0258496578" data-adsbygoogle-status="done" style="display: inline-block; height: 90px; width: 728px;"><ins style="background-color: transparent; border: medium none; display: inline-table; height: 90px; margin: 0px; padding: 0px; position: relative; visibility: visible; width: 728px;"><ins id="aswift_0_anchor" style="background-color: transparent; border: medium none; display: block; height: 90px; margin: 0px; padding: 0px; position: relative; visibility: visible; width: 728px;"></ins></ins></ins></div></span><span style="color: #0000bb;">text</span><span style="color: #007700;">-</span><span style="color: #0000bb;">align</span><span style="color: #007700;"></span><span style="color: #0000bb;">right</span><span style="color: #007700;">;<br>    </span><span style="color: #0000bb;">font</span><span style="color: #007700;">-</span><span style="color: #0000bb;">weight</span><span style="color: #007700;"></span><span style="color: #0000bb;">bold</span><span style="color: #007700;">;<br>    </span><span style="color: #0000bb;">font</span><span style="color: #007700;">-</span><span style="color: #0000bb;">size</span><span style="color: #007700;"></span><span style="color: #0000bb;">14px</span><span style="color: #007700;">;<br>}</span><span style="color: #0000bb;">input</span><span style="color: #007700;">{<br>    </span><span style="color: #0000bb;">border</span><span style="color: #007700;">:</span><span style="color: #0000bb;">1px solid </span><span style="color: #ff8000;">#4A779D;<br>    </span><span style="color: #0000bb;">padding</span><span style="color: #007700;"></span><span style="color: #0000bb;">3px 8px</span><span style="color: #007700;">;<br>    </span><span style="color: #0000bb;">margin</span><span style="color: #007700;">-</span><span style="color: #0000bb;">bottom</span><span style="color: #007700;"></span><span style="color: #0000bb;">8px</span><span style="color: #007700;">;<br>    </span><span style="color: #0000bb;">width</span><span style="color: #007700;"></span><span style="color: #0000bb;">164px</span><span style="color: #007700;">;<br>}</span><span style="color: #0000bb;">label</span><span style="color: #007700;">{<br>    </span><span style="color: #0000bb;">padding</span><span style="color: #007700;"></span><span style="color: #0000bb;">0px 0px 4px 0px</span><span style="color: #007700;">;<br>    </span><span style="color: #0000bb;">display</span><span style="color: #007700;">:</span><span style="color: #0000bb;">block</span><span style="color: #007700;">;<br>}</span><span style="color: #0000bb;">button</span><span style="color: #007700;">{<br>    </span><span style="color: #0000bb;">background</span><span style="color: #007700;"></span><span style="color: #ff8000;">#4A779D url(images/navigation.png) repeat-x scroll 0 0;<br>    </span><span style="color: #0000bb;">color</span><span style="color: #007700;"></span><span style="color: #ff8000;">#FFF;<br>    </span><span style="color: #0000bb;">border</span><span style="color: #007700;">:</span><span style="color: #0000bb;">1px solid </span><span style="color: #ff8000;">#4A779D;<br>    </span><span style="color: #0000bb;">padding</span><span style="color: #007700;"></span><span style="color: #0000bb;">4px 10px</span><span style="color: #007700;">;<br>    </span><span style="color: #0000bb;">width</span><span style="color: #007700;"></span><span style="color: #0000bb;">180px</span><span style="color: #007700;">;<br>}</span></span></code>



وهذا ملف ال html

رمز PHP:

 


<code><span style="color: black;"><span style="font-size: xx-small;"><span style="color: #007700;"><!</span></span><span style="font-size: xx-small;"><span style="color: #0000bb;">DOCTYPE html </span></span><span style="font-size: xx-small;"><span style="color: #007700;">PUBLIC </span></span><span style="font-size: xx-small;"><span style="color: #dd0000;">"-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"</span></span><span style="font-size: xx-small;"><span style="color: #007700;">><br><</span></span><span style="font-size: xx-small;"><span style="color: #0000bb;">html xmlns</span></span><span style="font-size: xx-small;"><span style="color: #007700;">=</span></span><span style="font-size: xx-small;"><span style="color: #dd0000;">"http://www.w3.org/1999/xhtml" </span></span><span style="font-size: xx-small;"><span style="color: #0000bb;">dir</span></span><span style="font-size: xx-small;"><span style="color: #007700;">=</span></span><span style="font-size: xx-small;"><span style="color: #dd0000;">"ltr" </span></span><span style="font-size: xx-small;"><span style="color: #0000bb;">lang</span></span><span style="font-size: xx-small;"><span style="color: #007700;">=</span></span><span style="font-size: xx-small;"><span style="color: #dd0000;">"en"</span></span><span style="font-size: xx-small;"><span style="color: #007700;">><</span></span><span style="font-size: xx-small;"><span style="color: #0000bb;">head profile</span></span><span style="font-size: xx-small;"><span style="color: #007700;">=</span></span><span style="font-size: xx-small;"><span style="color: #dd0000;">"http://gmpg.org/xfn/11"</span></span><span style="font-size: xx-small;"><span style="color: #007700;">><br><</span></span><span style="font-size: xx-small;"><span style="color: #0000bb;">meta http</span></span><span style="font-size: xx-small;"><span style="color: #007700;">-</span></span><span style="font-size: xx-small;"><span style="color: #0000bb;">equiv</span></span><span style="font-size: xx-small;"><span style="color: #007700;">=</span></span><span style="font-size: xx-small;"><span style="color: #dd0000;">"Content-Type" </span></span><span style="font-size: xx-small;"><span style="color: #0000bb;">content</span></span><span style="font-size: xx-small;"><span style="color: #007700;">=</span></span><span style="font-size: xx-small;"><span style="color: #dd0000;">"text/html; charset=utf-8" </span></span><span style="font-size: xx-small;"><span style="color: #007700;">/><br><</span></span><span style="font-size: xx-small;"><span style="color: #0000bb;">title</span></span><span style="font-size: xx-small;"><span style="color: #007700;">></span></span><span style="font-size: xx-small;"><span style="color: #0000bb;">القوائم الافقية بشكل جميل</span></span><span style="font-size: xx-small;"><span style="color: #007700;"></</span></span><span style="font-size: xx-small;"><span style="color: #0000bb;">title</span></span><span style="font-size: xx-small;"><span style="color: #007700;">><br><</span></span><span style="font-size: xx-small;"><span style="color: #0000bb;">meta name</span></span><span style="font-size: xx-small;"><span style="color: #007700;">=</span></span><span style="font-size: xx-small;"><span style="color: #dd0000;">"description" </span></span><span style="font-size: xx-small;"><span style="color: #0000bb;">content</span></span><span style="font-size: xx-small;"><span style="color: #007700;">=</span></span><span style="font-size: xx-small;"><span style="color: #dd0000;">"Computer tips, tricks en tutorials voor de gevorderde computer gebruikers." </span></span><span style="font-size: xx-small;"><span style="color: #007700;">/><br><</span></span><span style="font-size: xx-small;"><span style="color: #0000bb;">meta name</span></span><span style="font-size: xx-small;"><span style="color: #007700;">=</span></span><span style="font-size: xx-small;"><span style="color: #dd0000;">"keywords" </span></span><span style="font-size: xx-small;"><span style="color: #0000bb;">content</span></span><span style="font-size: xx-small;"><span style="color: #007700;">=</span></span><span style="font-size: xx-small;"><span style="color: #dd0000;">"computerfaq, leren, handleidingen, programmeren, php, webdevlopment, scripting, handleidingen" </span></span><span style="font-size: xx-small;"><span style="color: #007700;">/><br><</span></span><span style="font-size: xx-small;"><span style="color: #0000bb;">script type</span></span><span style="font-size: xx-small;"><span style="color: #007700;">=</span></span><span style="font-size: xx-small;"><span style="color: #dd0000;">"text/javascript" </span></span><span style="font-size: xx-small;"><span style="color: #0000bb;">src</span></span><span style="font-size: xx-small;"><span style="color: #007700;">=</span></span><span style="font-size: xx-small;"><span style="color: #dd0000;">"jquery.<acronym title="JavaScript">js</acronym>"</span></span><span style="font-size: xx-small;"><span style="color: #007700;">></span></span><span style="font-size: xx-small;"><span style="color: #0000bb;"></script></span></span><span style="font-size: xx-small;"> </span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;"><script type="text/javascript" src="dropmenu.</span><span style="font-size: xx-small;"><acronym title="JavaScript">js</acronym></span><span style="font-size: xx-small;">"></script> </span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;"><script></span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">$(document).ready(function(){</span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">    $("#nav-one").dropmenu();</span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">});</span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;"></script></span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;"><link rel="stylesheet" id="smthemenewprint-css"  href="style.css" type="text/css" /></span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;"></head></span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;"><body></span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;"><ul id="nav-one" class="dropmenu"> </span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">            <li> </span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">                <a href="#">الرئيسية</a> </span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">            </li> </span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">            <li> </span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">                <a href="#">المنتديات</a> </span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">                <ul> </span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">                    <li><a href="#">الدعم الفني</a></li> </span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">                    <li><a href="#">المساعدة</a></li> </span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">                    <li><a href="#">صفحة تجريبية</a></li></span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">                    <li><a href="#">صفحة تجريبية</a></li></span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">                </ul> </span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">            </li> </span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">            <li> </span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">                <a href="#item3">التحميل</a> </span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">                <ul> </span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">                    <li><a href="#">برامج كمبيوتر</a></li> </span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">                    <li><a href="#">كتب و راجع</a></li> </span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">                    <li><a href="#">مشاريع جاهزة</a></li> </span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">                </ul> </span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">            </li>  </span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">            <li> </span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">                <a href="#">المنتجــات</a> </span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">                <div class="products"></span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">                    <ul> </span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">                        <li><img src="images/236872.jpg" width="40" height="40" alt="Thumb" border="0" /><h2>تجربة تجربة</h2><p><a href="#">كلام يكتب هنا</a></p></li> </span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">                        <li><img src="images/242702.jpg" width="40" height="40" alt="Thumb" border="0" /><h2>تجربة تجربة</h2><p><a href="#">كلام يكتب هنا</a></p></li> </span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">                        <li><img src="images/242177.jpg" width="40" height="40" alt="Thumb" border="0" /><h2>تجربة تجربة</h2><p><a href="#">كلام يكتب هنا</a></p></li> </span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">                        <li><img src="images/226138.jpg" width="40" height="40" alt="Thumb" border="0" /><h2>تجربة تجربة</h2><p><a href="#">كلام يكتب هنا</a></p></li> </span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">                        <li><img src="images/216794.jpg" width="40" height="40" alt="Thumb" border="0" /><h2>تجربة تجربة</h2><p><a href="#">كلام يكتب هنا</a></p></li> </span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">                        <li><img src="images/211826.jpg" width="40" height="40" alt="Thumb" border="0" /><h2>تجربة تجربة</h2><p><a href="#">كلام يكتب هنا</a></p></li> </span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">                        <li><img src="images/203708.jpg" width="40" height="40" alt="Thumb" border="0" /><h2>تجربة تجربة</h2><p><a href="#">كلام يكتب هنا</a></p></li> </span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">                    </ul></span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">                    <div class="small">وصف يكتب هنا وصف يكتب هنا وصف يكتب هنا.</div></span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">                </div></span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">            </li></span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">            <li> </span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">                <a href="#">أدوات الهاكر الأخلاقي</a> </span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">                <div class="tutorials"></span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">                    <ul class="left"> </span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">                        <li><a href="#">الميتاسبلووت</a></li> </span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">                        <li><a href="#">برنامج Nikto</a></li> </span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">                        <li><a href="#">برامج فحص السرفرات</a></li> </span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">                    </ul></span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">                    <ul class="right"> </span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">                        <li><a href="#">برامج الهندسة العكسية</a></li> </span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">                        <li><a href="#">الهندسة العكسية</a></li> </span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">                        <li><a href="#">برامج الحقن</a></li> </span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">                    </ul></span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">                    <div class="small">مشاهدة <a href="#">جميع الأقسام</a> او <a href="#">اختر ما يناسبك من القائمة</a>.</div></span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">                </div></span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">            </li></span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">            <li> </span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">                <a href="#">روابط</a> </span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">                <ul> </span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">                    <li><a href="#">برمجة و تصميم</a></li> </span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">                    <li><a href="#">أمن معلومات</a></li> </span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">                    <li><a href="#">الويب 2.0</a></li> </span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">                    <li><a href="#">الدعم الفني</a></li> </span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">                    <li><a href="#">تجربة تجربة</a></li> </span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">                    <li><a href="#">قواعد البيانات</a></li> </span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">                    <li><a href="#">تجربة تجربة</a></li> </span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">                </ul> </span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">            </li></span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">            <li> </span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">                <a href="#">تسجيل الدخول</a> </span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">                <div class="login" dir="rtl"></span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">                    <label for="txtuser">اسم المستخدم: </label></span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">                    <input type="text" name="txtuser" id="txtuser" /></span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">                    <label for="txtuser">كلمة المرور: </label></span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">                    <input type="password" name="txtpass" id="txtpass" /></span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">                    <button>دخول</button></span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">                </div></span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">            </li>             </span><span style="font-size: xx-small;"><br></span><span style="font-size: xx-small;">        </ul> </span><span style="font-size: xx-small;"><br></span><span style="font-size: x-small;"><span style="font-size: xx-small;"></html></span> </span></span></code>



ممكن نشر المضوع ليستفسد الجميع
^_^