第一篇博客，还不知道怎么写

做个笔记吧，用CSS和HTML做成的铅笔 HTML

CSS
*{
margin: 0;
padding: 0;
}
.pencil{
height: 380px;
position: relative;
width: 60px;
margin: 50px auto 0;
}
.left, .center, .right{
display: inline-block;
height: 300px;
float: left;
}
.left, .right{
width: 15px;
position: relative;
}
.left{
background: -webkit-linear-gradient(left, #f2d41c, #e1c413);
background: -moz-linear-gradient(left, #f2d41c, #e1c413);
}
.right{
background: -webkit-linear-gradient(left, #f2d41c, #e1c413);
bacakground: -webkit-linear-gradient(left, #f2d41c, #e1c413);
}
.center{
width: 30px;
background: #f9dc32;
position: relative;
color: #000;
}
.top{
position: relative;
}
.bottom{
clear: both;
height: 20px;
background: linear-gradient(to bottom, #000, #ffbf00, #000, #ffbf00, #000);
border-radius: 0 0 10px 10px;
}
.top{
border-bottom: 60px solid #ffe8c6;
border-left: 30px solid transparent;
border-right: 30px solid transparent;
}
.top:before{
content: “”;
display: block;
position: absolute;
left: -10px;
border-bottom: 20px solid #000;
border-left: 10px solid transparent;
border-right: 10px solid transparent;
}
.center:before{
position: absolute;
content: “”;
display: block;
color: #000;
top: -10px;
border-bottom: 10px solid #f9dc32;
border-left: 15px solid transparent;
border-right: 15px solid transparent;
}
.left:before{
position: absolute;
content: “”;
display: block;
color: #000;
top: -7px;
border-bottom: 7px solid #f2d41c;
border-left: 7px solid transparent;
border-right: 7px solid transparent;
}
.right:before{
position: absolute;
content: “”;
display: block;
color: #000;
top: -7px;
border-bottom: 7px solid #f2d41c;
border-left: 7px solid transparent;
border-right: 7px solid transparent;
}