Today, I am very happy because the problem that I have solved for a long time but cannot be solved is the small triangle with a border. O (∩) O Haha ~
Paste the source code of a small demo made by yourself (here only the example pointing to is provided upwards, and others are similar ):
<! Doctype HTML> <br/> <pead> <br/> <meta charset = "GBK"> <br/> <title> first triangel with border demo </title> <br/> <style> <br/> body, button, input, select, textarea {<br/> Font: 12px/1.5 '', verdana, tahoma, Arial,/5b8b/4f53; /* followed by the Code */<br/>}< br/> Div {<br/> position: absolute; <br/> margin-top: 20px; <br/> border: 1px solid #999999; <br/> background-color: # ffffff; <br/> width: 100px; <br/> Height: 100px; <br/>}< br/> I, S {<br/> width: 0px; <br/> Height: 0px; <br/> font-size: 0px; <br/> line-Height: 0; <br/> overflow: hidden; <br/> border-width: 6px; /* For I change at S */<br/> position: absolute; <br/> border-color: transparent #999 transparent; <br/> border-style: dashed dashed solid dashed; <br/> left: 14px; <br/> top:-12px; <br/> Z-index: 30px; <br/>}< br/> S {<br/> border-width: 5px; <br/> border-bottom-color: # ffffff; <br/> left: 15px; <br/> top:-10px; <br/> Z-index: 40px; <br/>}< br/> </style> <br/> </pead> <br/> <body> <br/> <div> <br/> <i> </I> <br/> <S> </S> <br/> </div> <br/> </body> <br/> </ptml>
Perfect! I like it very much...