Define a horizontal virtual line with CSS?
We first need to understand the two styles of CSS about lines:
Dotted: ie4+ on the Mac platform ie5.5+ as a dotted line on Windows and UNIX platforms. Otherwise the solid line
Dashed: ie4+ on the Mac platform and ie5.5+ on Windows and UNIX platforms as dashed lines. Otherwise the solid line
The horizontal line, we can use HR to implement, also can define a div, its height set to 1px or other you want height.
CSS defines a horizontal dashed hr method:
<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 strict//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd" >< HTML xmlns= "http://www.w3.org/1999/xhtml" ><pead><meta http-equiv= "Content-type" content= "text/html"; Charset=utf-8 "/><title>www.webjx.com</title><style type=" text/css "><!--hr {border:1px # CCCCCC dotted;} --></STYLE></HEAD><BODY><HR size= "1" noshade= "NoShade"/></body></ptml>
[Ctrl + A ALL SELECT hint: You can modify some of the code, and then run]
CSS defines a horizontal dotted div method:
<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 strict//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd" >< HTML xmlns= "http://www.w3.org/1999/xhtml" ><pead><meta http-equiv= "Content-type" content= "text/html"; Charset=utf-8 "/><title>www.webjx.com</title><style type=" text/css "><!--#aaa {border-top : 1px dashed #cccccc; height:1px;overflow:hidden;} --></style></pead><body><div id= "AAA" ><a href= "http://www.webjx.com/" > Web Teaching Network- Www.webjx.com</a></div></body></ptml>
[Ctrl + A ALL SELECT hint: You can modify some of the code, and then run]
Need you to pay attention to the definition of CSS in HR method: hr {border:1px #cccccc dotted;} used dotted attribute. The dashed attribute is used in the Div method. On the surface, there is no obvious difference between the two. But in different browser environments, there may be some differences. But none of this matters, because most people see the same effect. Dashed. ：）
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
