大数据最新学习css3，使用代码实现一根心爱的二踢脚_css画脚丫(1)

height: 20px;
width: 100%;
content: ‘’;
display: block;
border-radius: 50%;
background-color: #ceb49b;
}

.ertijiao:after {
position: absolute;
bottom: -10px;
height: 15px;
width: 100%;
border-radius: 50%;
content: ‘’;
display: block;
background-color: #1d120e;
}

#### 4、引火线（炮蔫儿）的实现


这里比较简单，采用一个DIV元素，对其进行绝对定位。关键是要有一个角度旋转，这里旋转了30度，更有利于小伙伴去引燃火热的2023年。代码如下：

2
0
2
3

// css部分
.pao-nian-er {
position: absolute;
left: 44px;
bottom: 36px;
width: 40px;
height: 4px;
background: #616044;
transform: rotate(30deg);
box-shadow: 4px 2px 5px #000044;
}

最终实现效果如图：


![f92945f12a34441bbd7b0e66705fc7fd.png](https://img-blog.csdnimg.cn/f92945f12a34441bbd7b0e66705fc7fd.png)



#### 5、css书写顺序说明


很多小伙伴其实对于css的书写顺序并不是太敏感，想到哪里就写到哪里，其实这是不太合适的。其实顺序应该大致是这样子的：


△ 首先书写的是外部定位的属性样式，例如：


   position，overflow， float等


   top left margin-top margin-left 等


△ 然后是表框相关的，例如：


   border border-radius 等


△ 然后是内部填充或者内部布局相关的，例如：


width height 等


  display padding  background等


△ 然后是内部字体相关的


**整体是一个由外而内的过程**



#### 6、完整源代码

2
0
2
3

#### 7、结语：


吉祥的兔年终归还是来了，大家在2022年真是艰苦卓绝的一年，疫情，工作，小洋人，希望在这个喜庆的二踢脚的点燃下，喜迎2023，点燃你，温暖我。



![img](https://img-blog.csdnimg.cn/img_convert/afb169a675d72dc113ebe46fef698852.png)
![img](https://img-blog.csdnimg.cn/img_convert/477751f9659d7ab7ccb993b8616f51c5.png)

**网上学习资料一大堆，但如果学到的知识不成体系，遇到问题时只是浅尝辄止，不再深入研究，那么很难做到真正的技术提升。**

**[需要这份系统化资料的朋友，可以戳这里获取](https://bbs.csdn.net/topics/618545628)**


**一个人可以走的很快，但一群人才能走的更远！不论你是正从事IT行业的老鸟或是对IT行业感兴趣的新人，都欢迎加入我们的的圈子（技术交流、学习资源、职场吐槽、大厂内推、面试辅导），让我们一起学习成长！**

那么很难做到真正的技术提升。**

**[需要这份系统化资料的朋友，可以戳这里获取](https://bbs.csdn.net/topics/618545628)**


**一个人可以走的很快，但一群人才能走的更远！不论你是正从事IT行业的老鸟或是对IT行业感兴趣的新人，都欢迎加入我们的的圈子（技术交流、学习资源、职场吐槽、大厂内推、面试辅导），让我们一起学习成长！**