Doriți să reacționați la acest mesaj? Creați un cont în câteva clickuri sau conectați-vă pentru a continua.

Tutorial complet CSS part 4

2 participanți

 :: Tutoriale :: Tutoriale Web :: CSS

In jos

Tutorial complet CSS part 4 Empty Tutorial complet CSS part 4

Mesaj Scris de Pein Lun Iul 26, 2010 3:04 am

Stiluri pentru liste


6.1 list-style-type
Folosind eticheta ol din HTML
cream liste ordonate sau numerotate. Adaugand comenzi CSS in zona HEAD
putem adauga pe langa numere si cifre sau alte simboluri. Browserul
Netscape nu permite asocierea comenzilor CSS decat pentru eticheta li. Sintaxa este:
Cod:
<style type="text/css">
 <!--
 li {list-style-type: valoare;}
 -->
 </style>
valoarea poate fi:
valoare disc
disc disc
circle cerc
square patrat
decimal numere intregi
lower-roman numere romane, caractere mici (i, ii, iii, iv)
upper-roman numere romane, caractere mari (I, II, III, IV)
upper-alpha litere mari (A, B, C, D)
lower-alpha litere mici (a, b, c, d)
none nimic
Exemplu: lista ordonata folosind marcaje cu litere mici
Cod:
<html>
 <head>
 <title>Exemplu 6_1</title>
 <style type="text/css">
 <!--
 li {list-style-type: lower-alpha;}
 -->
 </style>
 </head>
 <body>
 Necesar materiale:
 <ol>
 <li>caramida</li>
 <li>ciment</li>
 <li>ipsos</li>
 </ol>
 <script type="text/javascript">//<![CDATA[
                  var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
                  document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
                 //]]></script>
                 <script type="text/javascript">//<![CDATA[
                     try
                     {
                        var pageTracker = _gat._getTracker("UA-6105650-13");
                        pageTracker._setDomainName("none");
                        pageTracker._setAllowLinker(true);
                        pageTracker._trackPageview();
                     }
                     catch(err){}
                 //]]></script></body>
 </html>

6.2 list-style-image
In afara simbolurilor de marcaj prestabilite cunoscute de browser pot fi folosite si imagini prin comansa CSS list-style-image. Imaginile sunt introduse prin adresa url(). Exemplu: lista ordonata folosind ca marcaj imaginea punct.gif
Cod:
<html>
 <head>
 <title>Exemplu 6_2</title>
 <style type="text/css">
 <!--
 li {list-style-image: url(punct.gif);}
 -->
 </style>
 </head>
 <body>
 Necesar materiale:
 <ul>
 <li>caramida</li>
 <li>ciment</li>
 <li>ipsos</li>
 </ul>
 <script type="text/javascript">//<![CDATA[
                  var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
                  document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
                 //]]></script>
                 <script type="text/javascript">//<![CDATA[
                     try
                     {
                        var pageTracker = _gat._getTracker("UA-6105650-13");
                        pageTracker._setDomainName("none");
                        pageTracker._setAllowLinker(true);
                        pageTracker._trackPageview();
                     }
                     catch(err){}
                 //]]></script></body>
 </html>
Pein
Pein
Fondator
Fondator

<b>Sex</b> Sex : masculin
<b>Mesaje</b> Mesaje : 617
<b>Credite</b> Credite : 5951
<b>Varsta</b> Varsta : 30
<b>Localizare</b> Localizare : Campina
<b>Respectarea Regulamentului</b> Respectarea Regulamentului : Tutorial complet CSS part 4 0w11

https://help-forums.all-up.com

Sus In jos

Tutorial complet CSS part 4 Empty Re: Tutorial complet CSS part 4

Mesaj Scris de God Joi Oct 07, 2010 1:56 am

Ma apropii de final...Aproape ca am terminat de citit.
God
God
Member
Member

<b>Sex</b> Sex : masculin
<b>Mesaje</b> Mesaje : 91
<b>Credite</b> Credite : 5251
<b>Varsta</b> Varsta : 30
<b>Localizare</b> Localizare : Home
<b>Respectarea Regulamentului</b> Respectarea Regulamentului : Tutorial complet CSS part 4 0w11

http://Gods.forumz.ro

Sus In jos

Sus

- Subiecte similare

 :: Tutoriale :: Tutoriale Web :: CSS

 
Permisiunile acestui forum:
Nu puteti raspunde la subiectele acestui forum