العالم العربي
هل تريد التفاعل مع هذه المساهمة؟ كل ما عليك هو إنشاء حساب جديد ببضع خطوات أو تسجيل الدخول للمتابعة.

قوائمة جميلة بhtml و Css

استعرض الموضوع التالي استعرض الموضوع السابق اذهب الى الأسفل

قوائمة جميلة بhtml و Css Empty قوائمة جميلة بhtml و Css

مُساهمة من طرف Ch.Marwen الجمعة 31 مايو 2013, 05:33

bsmlah


قوائمة جميلة بhtml و Css




: أهلا بكم من جديد في منتديات تونس الابداع عامة و منتدى التطوير ولغات البرمجة خاضة

أقدم لكم
هذه القوائم لأستفيد منها في تصميمي الجديد القوائم من تصميمه بالأشتمل و السي إس إس طبعا يمكن تطويرها أكثر وأكثر لتتناسب
مع أعمالكم أنا سأضع لكم مثال لكل قائمة والكود الخاص بها ـ
أولا سأقدم لكم كود السي إس إس الذي يعمل مع جميع القوائم أضف كود السي إس إس ثم إختر كود الأتش تي إم إل الخاص بالقائمة
التي تفضلها


قوائمة جميلة بhtml و Css %D8%A8%D8%AF%D9%88%D9%86+%D8%B9%D9%86%D9%88%D8%A7%D9%86-1




الكود:
<style type="text/css" rel="stylesheet">
  table{
    /* الجوانب دون ملئ */
    border-collapse:collapse;
  }
      /*خصائص الصفوف */
  .taula_menu tr{
    border-top:dotted 1px  #02223E;
  }
  /* خصائص الأعمدة */
  .taula_menu td{        background-color:#FFAFAF;      width:100px;
    font:bold 12px Arial;
    text-align:center;        }      .taula_menu td:hover{        background-color:#CF4D4D;      font:bold 14px Arial;        }        /* Propietats de les columnes */      .taula_menu_2 td{
    background-color:#AFE3FF;
    vertical-align:top;
    width:70px;
    font:bold 12px Arial;
    text-align:center;
    border-top:solid 4px  #02223E;
  }      .taula_menu_2 td:hover{
    background-color:#AFE3FF;
    color:#175A7F;
    text-align:center;
    border-top:solid 4px orange;
  }
      span
  {
    border:1px solid #000000;
    padding:4px;
    margin:0px;
    font:bold 12px Arial;
    background-color:green;
    color:#ffffff;
    width:120px;
  }
    p
  {
    padding:0;
    margin:3px;
    font:bold 12px Verdana;
    color:#ffffff;
    background-color:orange;
    width:120px;
    padding:4px;
  }
  a:hover
  {
    color:yellow;
  }
  a{
    text-decoration:none;
    color:#ffffff;
  }
  </style>


لمعاينة القوائم اضغط هنا


الكود:
<!-- القائمة الأولى -->
<table class="taula_menu" border="1" cellpadding="4" cellspacing="0">
<tr><td>Música</td></tr>
<tr><td>Cinema</td></tr>
<tr><td>Llibres</td></tr>
<tr><td>Jocs</td></tr>
<tr><td>Ciència</td></tr>
<tr><td>Notícies</td></tr>
</table>



الكود:
<!-- القائمة الثانية -->

  <table class="taula_menu_2" border="1" cellpadding="4" cellspacing="0">


  <tr>


    <td>Música</td>


    <td>Cinema</td>


    <td>Llibres</td>


    <td>Jocs</td>


    <td>Ciència</td> 


    <td>Notícies</td>


  </tr> 


  </table>


<!-- القائمة الثالثة -->

  <span>Música</span>


  <span>Cinema</span>


  <span>Llibres</span>


  <span>Jocs</span>


  <span>Ciència</span>


  <span>Notícies</span>


الكود:
<!-- القائمة الرابعة -->

  <p><a href="direccio_web">Pàgina principal</a></p>


  <p><a href="direccio_web">Videojocs</a></p>


  <p><a href="direccio_web">DVD</a></p>


  <p><a href="direccio_web">Blue-ray</a></p>


  <p><a href="direccio_web">Moda</a></p>


  <p><a href="direccio_web">Tecnologia</a></p>


  <p><a href="direccio_web">Moda</a></p>


  <p><a href="direccio_web">Reals</a></p>

جميع الحقوق محفوظة لدى منتديات تونس الابداع
145 145 145

Ch.Marwen
Ch.Marwen
الادارة العليا
الادارة العليا

المتصفح : Google Chrome
الإقامة : Republic of Tunisia
الجنس : ذكر
عدد المساهمات : 25405
نقاط : 103330942
تقييم : 7859
تاريخ الميلاد : 14/01/1990
تاريخ التسجيل : 11/02/2012
العمر : 34

http://www.arabwoorld.com
-----

الرجوع الى أعلى الصفحة اذهب الى الأسفل

استعرض الموضوع التالي استعرض الموضوع السابق الرجوع الى أعلى الصفحة

- مواضيع مماثلة

 
صلاحيات هذا المنتدى:
لاتستطيع الرد على المواضيع في هذا المنتدى

  • ©phpBB | منتدى مجاني | منتدى مجاني للدعم و المساعدة | التبليغ عن محتوى مخالف | ملفات تعريف الارتباط التابعة لجهات خارجية | آخر المواضيع