css div快捷写法 |css旋转动画特效代码

对于div元素样式的设计，最基本的方式就是使用div的ID和Class属性来定义div样式，并将其作为CSS里的一个选择器来使用。

#myDiv {
width: 100%;
height: 100px;
background-color: blue;
}
.redDiv {
width: 50%;
height: 50px;
background-color: red;
}

但是，CSS还有一些快捷的写法，可以让大家更加方便地为div元素添加样式。下面，就来总结一下CSS div快捷写法。

一、同级元素相邻选择器

div + div {
margin-top: 10px;
}

二、子代元素选择器

div >p {
color: red;
}

三、通配选择器

* {
margin: 0;
}

四、类选择器的多个class名

div.className1.className2 {
background-color: green;
}

五、伪类选择器

a:hover {
text-decoration: none;
color: red;
}

六、属性选择器

input[type="text"] {
width: 200px;
}

总结：以上六种CSS div快捷写法，可以减少CSS代码的冗余，提高代码的可读性和维护性。大家应该多加利用这些CSS快捷写法，在设计div元素样式时可以更加便利。