詳解CSS定義HR水平線的幾種樣式

來源:互聯網
上載者:User
 
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
  2. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> 
  3. <head> 
  4.  <title>CSS定義HR水平線</title> 
  5.  <style type="text/css"> 
  6.  <!-- 
  7. .hr0{ height:1px;border:none;border-top:1px dashed #0066CC;} 
  8. .hr1{ height:1px;border:none;border-top:1px solid #555555;} 
  9. .hr2{ height:3px;border:none;border-top:3px double red;} 
  10. .hr3{ height:5px;border:none;border-top:5px ridge green;} 
  11. .hr4{ height:10px;border:none;border-top:10px groove skyblue;} 
  12.  --> 
  13.  </style> 
  14. </head> 
  15. <body> 
  16. <hr class="hr0" /> 
  17. <hr class="hr1" /> 
  18. <hr class="hr2" /> 
  19. <hr class="hr3" /> 
  20. <hr class="hr4" /> 
  21. </body> 
  22. </html> 


相關文章

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.