标签: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