<style> | |
/* 修改样式 */ | |
/* 格式为:选择器 {属性:值;} */ | |
/* 标签选择器 */ | |
p { | |
color: blueviolet; | |
font-size: 12px; | |
} | |
div { | |
color: green; | |
font-size: 26px; | |
} | |
/* 类选择器 */ | |
/* 格式 | |
.类名{属性:属性值;} */ | |
.red2 { | |
color: blue; | |
} | |
.red { | |
width: 100px; | |
height: 100px; | |
background-color: crimson; | |
} | |
.heise { | |
width: 50px; | |
height: 50px; | |
background-color: black; | |
} | |
.red1 { | |
width: 50px; | |
height: 50px; | |
background-color: red; | |
} | |
/* id选择器 | |
格式:#id名{ 属性:属性值;}*/ | |
#pink { | |
color: pink; | |
font-size: 50px; | |
} | |
</style> | |
</head> | |
<body> | |
<p>样式规格</p> | |
<p class="red2">样式规格</p> | |
<p>样式规格</p> | |
<!-- 利用类选择器画三个盒子的案例 --> | |
<div class="red">红色</div> | |
<div class="heise">黑色</div> | |
<div class="red1">红色</div> | |
<div id="pink">我姓陈</div> | |
</body> | |
</html> |
css的选择基本格式
最新推荐文章于 2022-04-27 21:34:45 发布