CSS/עיצוב רשימות
מתוך ויקיספר, אוסף ספרי הלימוד והמדריכים החופשי.
< CSS
[עריכה] תזכורת
יש כמה סוגי רשימות ב-HTML:
- ul
- ol
- dl
[עריכה] המאפיין list-style
המאפיין list-style קובע את סוג התבליט ויכול לקבל את הערכים הבאים
- disc - עיגול מלא ליד כל פריט
- circle - מעגל ליד כל פריט
- square - ריבוע ליד כל פריט
- decimal - מספר
- decimal-leading-zero - מספר עם אפסים בהתחלה
- lower-roman - ספרות רומיות קטנות
- upper-roman - ספרות רומיות גדולות
- none - ללא שום תבליט
[עריכה] דוגמא
<html>
<head>
<style type="text/css">
ul.disc {list-style-type: disc}
ul.circle {list-style-type: circle}
ul.square {list-style-type: square}
ul.none {list-style-type: none}
</style>
</head>
<body>
<ul class="disc">
<li>אתר א</li>
<li>אתר ב</li>
<li>אתר ג</li>
</ul>
<ul class="circle">
<li>אתר א</li>
<li>אתר ב</li>
<li>אתר ג</li>
</ul>
<ul class="square">
<li>אתר א</li>
<li>אתר ב</li>
<li>אתר ג</li>
</ul>
<ul class="none">
<li>אתר א</li>
<li>אתר ב</li>
<li>אתר ג</li>
</ul>
</body>
</html>
התוצאה שתתקבל בדוגמה זו היא אוסף של רשימות מהצורה
- אתר א
- אתר ב
- אתר ג
שתוכנן זהה, פרט לשוני בתבליטים בצד הרשימה (שכאמור, משתנים לפי המחלקה אותה בחרנו).
