بولت (bullet) های سفارشی

یکشنبه, ۱۲ام آبان , ۱۳۸۷ | ۲ دیدگاه

Bullet ها برای نشان دادن لیستها در صفحات وب بکار میروند . Bullet ها فقط به اشکال دایره، مربع محدود نمیشوند و میتوان توسط CSS از هر شکلی بعنوان Bullet استفاده نمود .

برای شروع توسط تگ ul(Unorderd List) باید لیست خود را تهیه کنیم :

  1. <ul>
  2. <li>List item one</li>
  3. <li>List item two</li>
  4. <li>List item three</li>
  5. </ul>

اکنون کافیست که در فایل CSS این چند خط را اضافه کنیم :

  1. <style type=“text/css”>
  2. li.newbullet {
  3. list-style-image:url(arrow.gif)
  4. }
  5. </style>

هم اکنون کافیست که Bullet هارا به متن مورد نظرمان نسبت دهیم :

  1. <ul>
  2. <li class=“newbullet”>List item one</li>
  3. <li>List item two</li>
  4. <li class=“newbullet”>List item three</li>
  5. </ul>

البته باید دقت کنید که قبلا بولت دلخواه هود را رسم کرده باشد ،در این مثال نام بولت ماarrow.gif   میباشد و در روت اصلی سات قرار گرفته است . به همین سادگی و میتوانید نتیجه کار را اینجا مشاهده نمایید .

همچنین برای مشاهده سورس کامل برنامه در همان صفحه Demo سورس برنامه را ببینید .

Be Sociable, Share!


۲ دیدگاه


  1. wd
    ۲۲ مهر ۱۳۹۰

    با تشکر فراوان




  2. amirhossein
    ۱ مرداد ۱۳۹۱

    ممنون از تلاش فراوانتون!



دیدگاه خود را بنویسید