337day(css複雜選擇器,常見css屬性)
阿新 • • 發佈:2018-12-26
《2018年9月5日》【連續337天】
標題:css複雜選擇器,常見css屬性;
內容:
1.
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <link rel="stylesheet" type="text/css" href="l3.css"> </head> <body> <div> <em>456</em> <strong> <em>123</em> </strong> </div> <em>123</em> <div>1</div> <div class="demo">2</div> <p class="demo">3</p> </body> </html>
/*父子選擇器/派生選擇器*/
strong em{
background-color: red;
}
/*直接子元素選擇器*/
div > em{
background-color: blue;
}
/*並列選擇器*/
div.demo{
background-color: yellow;
}
/*分組選擇器*/
/*em,div{
background-color: red;
}*/
2.css屬性:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <link rel="stylesheet" type="text/css" href="l5.css"> </head> <body> <div> 舉個例子 </div> </body> </html>
div{
font-size: 25px;
font-weight: bold;
font-style: italic;
font-family: arial;
/*color: red;*/
color: #f40;
/*color: rgb(123,123,123);*/
border:20px solid;
border-top-color: blue;
border-left-color: yellow
}