advanced code snippet search

Posted By

DrPepper on 11/09/10


Tagged


Versions (?)

[HTML] Order list / unorder list /definition list

 / Published in: HTML
 

if you make a long page and if you want to jump to a topic in your page, you just add id in a wherever you want and make a link to that id tag. In this case, i made some id in a tag. Don't forget id uses # mark !!

Expand | Embed | Plain Text 
  1. <?xml version="1.0" encoding="UTF-8"?> 
  2. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  3. "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
  4.  
  5. <html xmlns="http://www.w3.org/1999/xhtml"> 
  6. <head> 
  7. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
  8.  
  9. </head> 
  10. <body style="background-color: #808080; color: #FFFFFF;" vlink="#0000A0" alink="#408080" link="#804000"> 
  11.  
  12.  
  13. <!-- ###########################################################################
  14.      # [ADDED] 2010/10/14     create favs.html                                 #
  15.      ########################################################################--> 
  16.  
  17. <h1 style="text-align: center">Ryutaro Matsuda's Favorites</h1> 
  18.  
  19. <a href="#web" title="Favorite web pages">See my Favorite Web Pages</a><br /> 
  20. <a href="#class" title="Favorite Classes">See my Favorite Classes</a><br /> 
  21. <!--############################################################################
  22.     # 3 unordered lists                                                        #
  23.     #########################################################################-->         
  24.  
  25. <div> 
  26.  
  27.           <h3 id="sports">Favorite Sports</h3> 
  28.           <ul> 
  29.              <li>Skateboarding</li> 
  30.              <li>Surfing</li> 
  31.              <li>Snow boarding</li> 
  32.              <li>Tennis</li> 
  33.              <li>Soccer</li>  
  34.           </ul> 
  35.  
  36.           <h3 id="sk8">Favorite skate brand</h3> 
  37.           <ul style="list-style-type: circle"> 
  38.                <li>autobahn wheel</li> 
  39.                <li>western edition</li> 
  40.                <li>momentum</li> 
  41.                <li>FTC</li> 
  42.                <li>venture</li> 
  43.           </ul> 
  44.  
  45.           <h3 id="color">Favorite color</h3> 
  46.           <ul style="list-style-type: square"> 
  47.                <li><span style="color: #000000">Black</span></li> 
  48.                <li><span style="color: #FFFFFF">White</span></li> 
  49.                <li><span style="color: #151B8D">Blue</span></li> 
  50.                <li><span style="color: #008000">Green</span></li> 
  51.                <li><span style="color: #c0c0c0">Silver</span></li> 
  52.           </ul> 
  53.  
  54.  
  55. <!--###########################################################################
  56.     # 4 orderd lists                                                          #
  57.     ########################################################################--> 
  58.           <h3>Favorite food</h3> 
  59.           <ol style="list-style-type: lower-alpha"> 
  60.                <li>Pasta</li> 
  61.                <li>Salda</li> 
  62.                <li>Pizza</li> 
  63.                <li>Burrito</li> 
  64.                <li>tacos</li> 
  65.           </ol> 
  66.           <h3>Favorite Drink</h3> 
  67.           <ol style="list-style-type: upper-alpha"> 
  68.                <li>Water</li> 
  69.                <li>Coffee</li> 
  70.                <li>Splight</li> 
  71.                <li>Dark Cherry Cola</li> 
  72.                <li>Red Wine</li> 
  73.           </ol> 
  74.  
  75.           <h3 id="city">Favorite City</h3> 
  76.           <ol style="list-style-type: lower-roman"> 
  77.                <li>Tokyo[JP]</li> 
  78.                <li>San Fransisco[US]</li> 
  79.                <li>Kuala lumpur[MY]</li> 
  80.                <li>Osaka[JP]</li> 
  81.                <li>Sacramento[US]</li> 
  82.           </ol> 
  83.           <h3>Favorite App on my iPhone</h3> 
  84.           <ol style="list-style-type: upper-roman"> 
  85.                <li>Google Voice</li> 
  86.                <li>Skype</li> 
  87.                <li>RedBull TV</li> 
  88.                <li>977music.com</li> 
  89.                <li>PS Express</li> 
  90.           </ol> 
  91.           <h3>Favorite Starbucks Drink</h3> 
  92.           <ol> 
  93.                <li>Bold Pick of Day [Black]</li> 
  94.                <li>Java Chip Frappuccino</li> 
  95.                <li>Espresso Chocolate Truffle</li> 
  96.                <li>Peppermint White Chocolate Mocha</li> 
  97.                <li>Vanilla Beans Frappuccino</li> 
  98.           </ol> 
  99.  
  100.  
  101.  <!--##########################################################################
  102.      # unoder list with image                                                 #
  103.      #######################################################################-->         
  104.  
  105.           <h3 id="web">Favorite Web Page</h3> 
  106.           <ul style="list-style-image: url(./023.png)"> 
  107.                <li><a href="http://unitedstateonline.com/store3/" target="_blank">United State Online</a></li> 
  108.                <li><a href="http://hypetype.co.uk/" target="_blank">Hype Type</a></li> 
  109.                <li><a href="http://aboveandbeyond.nu/" target="_blank">Above and Beyond</a></li> 
  110.                <li><a href="http://bettafootwear.com/" target="_blank">BettaFootWear</a></li> 
  111.                <li><a href="http://www.redbull.com/tv" target="_blank">RedBull TV</a></li> 
  112.           </ul> 
  113.  
  114.  
  115.  
  116. <!--###########################################################################
  117.     # Definition list                                                         #
  118.     ########################################################################--> 
  119.  
  120.  
  121.           <h3 id="class">Favorite Class</h3> 
  122.           <dl> 
  123.                <dt>AERO 121/120</dt> 
  124.                     <dd>Basic skill of Aviation class</dd> 
  125.                <dt>CISP 301</dt> 
  126.                     <dd>Basic skill of computer Programing</dd> 
  127.                <dt>CISW 320</dt> 
  128.                     <dd>Basic skill of web design</dd> 
  129.                <dt>CISC 320</dt> 
  130.                     <dd>Basic skill of operation system</dd> 
  131.                <dt>CISP 360</dt> 
  132.                     <dd>Intermidiate C++/C programing</dd> 
  133.           </dl> 
  134.           <a href="mailto:[email protected]" title="link to email me">Email Webmasterr</a><br /> 
  135.           <a href="#sports" title="Favorite Sports">See my Favorite Sports</a><br /> 
  136.           <a href="#city" title="Favorite Cities">See my Favorite Cities</a><br /> 
  137.           <a href="#sk8" title="Favorite Skate brands">See my Favorite Skate brands</a><br /> 
  138.           <a href="#color" title="Favorite Colors">See my Favorite Colors</a><br /> 
  139.      <a href="../index.html" title="link to home">>>Go Back to Home</a><br /> 
  140. </div> 
  141. </body> 
  142. </html>

Report this snippet  

You need to login to post a comment.