标签:css
css基本选择器
.bb{ color: red; font-size: 45px; } .c3{ color: rebeccapurple; font-size: 45px; } .c4{ color: aquamarine; font-size: 45px; }
css样式存在位置
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title></title> <link rel="stylesheet" href="commons.css"/> <style> .cc{ color: royalblue; font-size: 39px; } .ccc{ color: green; font-size: 50px; } </style> </head> <body> <div class="bb">bb</div> <br> <div class="cc">cc</div> <br> <div class="ccc">cc</div> </body> </html>
层级选择器
.{ : ; : ; } .{ : ; : ; }
<!DOCTYPE > <> <> <> <>层级选择器</> </> </> <> <>c3 <> <> <> c4</> </> <> c4</> </> </> <> c4</> </> </>
css-float属性
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>css-float属性</title> </head> <body> <div style="width: 300px"> <div style="background-color: red;float:left;width: 20%;">20%</div> <div style="background-color: aquamarine;float: left;width: 50%;">50%</div> <div style="float:right;width: 10%;background-color: pink;">10%</div> </div> </body> </html>
css-float属性2
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>css-float属性2</title> </head> <body> <div style="background-color: red;"> 1234 <p>1</p> <p>2</p> <p>3</p> <p>4</p> </div> <br> <div style="width: 300px;background-color: brown"> <div style="background-color: brown;float: left;width: 20%;">123</div> <div style="background-color: aqua;float: left;width: 60%">456</div> <div style="float: right;width: 30%;background-color: black">789</div> <div style="clear:both;">987654321</div> </div> </body> </html>
标签:css
原文地址:http://9272317.blog.51cto.com/9262317/1826137