API tools faq
paste
lmarkov

Lists - nested items

lmarkov
Nov 25th, 2012
118
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 5 3.81 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <html>
  3.     <head>
  4.         <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  5.        
  6.         <title>Упражнение № 2 - Lists</title>
  7.                
  8.         <link rel="stylesheet" type="text/css" href="reset.css"/>
  9.         <link rel="stylesheet" type="text/css" href="style.css"/>
  10.        
  11.     </head>
  12.     <body>
  13.         <div id="content">
  14.             <p>
  15.                 Preceding Text
  16.             </p>
  17.            
  18.             <ul class="listTypeUpperRoman">
  19.                 <li>
  20.                     List item 1
  21.                         <ul class="listTypeLowerLatin">
  22.                             <li>
  23.                                 Nested item 1.1
  24.                             </li>
  25.                             <li>
  26.                                 Nested item 1.2
  27.                             </li>
  28.                         </ul>
  29.                 </li>
  30.                 <li>
  31.                     List item 2
  32.                         <ul class="listTypeDecimal">
  33.                             <li>
  34.                                 Nested item 2.1
  35.                             </li>
  36.                             <li>
  37.                                 Nested item 2.2
  38.                                     <ul class="listTypeCircle">
  39.                                         <li>
  40.                                             Nested item 2.2.1
  41.                                         </li>
  42.                                         <li>
  43.                                             Nested item 2.2.2
  44.                                                 <ul class="listTypeDisc">
  45.                                                     <li>
  46.                                                         Nested item 2.2.2.1
  47.                                                     </li>
  48.                                                     <li>
  49.                                                         Nested item 2.2.2.2
  50.                                                     </li>
  51.                                                 </ul>
  52.                                         </li>
  53.                                         <li>
  54.                                             Nested item 2.2.3
  55.                                         </li>
  56.                                     </ul>
  57.                             </li>
  58.                             <li>
  59.                                 Nested item 2.3
  60.                             </li>
  61.                         </ul>
  62.                 </li>
  63.                 <li>
  64.                     List item 3
  65.                     <ul class="listTypeDisc">
  66.                             <li>
  67.                                 Nested item 3.1
  68.                             </li>
  69.                             <li>
  70.                                 Nested item 3.2
  71.                             </li>
  72.                             <li>
  73.                                 Nested item 3.3
  74.                             </li>
  75.                         </ul>
  76.                 </li>
  77.             </ul>
  78.         </div>
  79.     </body>
  80. </html>
  81.  
  82. ********************************************
  83. CSS
  84. *****************************
  85.  
  86. body
  87. {
  88.     font-family:  Times New Roman;
  89.     font-size: 1em;
  90.     color: #000000;
  91. }
  92.  
  93. #content
  94. {
  95.     margin: 20px;
  96. }
  97.  
  98. h1
  99. {
  100.     padding: 10px 0px 20px 0px;
  101. }
  102.  
  103. p
  104. {
  105.     padding: 0px 0px 10px 0px;;
  106. }
  107.  
  108. ul
  109. {
  110.     margin: 0px 0px 0px 30px;
  111. }
  112.  
  113. ul.listTypeUpperRoman li
  114. {
  115.     list-style-type: upper-roman;
  116. }
  117.  
  118. ul.listTypeLowerLatin li
  119. {
  120.     list-style-type: lower-latin;
  121. }
  122.  
  123. ul.listTypeDecimal li
  124. {
  125.     list-style-type:  decimal;
  126. }
  127.  
  128. ul.listTypeCircle li
  129. {
  130.     list-style-type:  circle;
  131. }
  132.  
  133. ul.listTypeDisc li
  134. {
  135.     list-style-type:  disc;
  136. }
  137.  
  138. hr
  139. {
  140.     width: 50%;
  141.     height: 2px;
  142.     color: #000000;
  143.     margin: 15px 0px 15px 0px;
  144.     text-align: left;
  145. }
Advertisement
Add Comment
Please, Sign In to add comment
Public Pastes
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!