前言:
css算不上一门编程语言,专业一点可以称他为层叠样式表,不专业的可以说他是给html标签加上美化属性。
常见的css属性:
栗子:
注意: 每一个属性间需要用英文分号进行间隔 (;)
选择器是啥? 比如我要给我的a标签加一个美化
a{
color: black;
backgroud-color: white
}
上面说呈现的是给a标签内的字体改为白色,字体背景改成黑色。
这时候就有人要说了: 给a标签加属性后,不是所有的a标签不都是这个样式了,这时候就可以考虑是否用标签内置。
还是拿a标签举栗子
<a style:"color: white;black-ground: white"></a>
这样就不会影响到别的a标签了
上面的a标签也代表别的标签~
选择器:
啥是选择器?
栗子:
.font {
text-size: 10px;
color: white;
}
上面的代码中.font就是选择器
怎么引用这段属性?
这里拿div标签举例:
<div class:"font">demo</div>
理论结束
常见的css属性:
margin-top: 10px //离上面的外边距离
margin-bottom: 10px //离上面的外边距离
margin-left: 10px //离上面的外边距离
margin-right: 10px //离上面的外边距离
color: (可以填支持的颜色英文/16进制代码)
color: rgba(242,179,179,0.15); //用rgb颜色代码,这里的rgba为设置颜色透明度15代表透明度为15.(也可以直接使用rgb)
background-color: (可以填支持的颜色英文/16进制代码)
background-color: rgba(242,179,179,0.15);
text-align: center: //字体在样式中处于中间位置,可能会与某些属性参数排斥反应,适用于大多数场景。
text-size: 10px //字体大小(只是大小,并不是粗细)
font-weight: 100 //字体粗细(只是粗细,并不是大小)
border-size: 1px //外边框粗细(将属性定义为none则表示去除边框)
border-radius: 25px //设置元素的外边框圆角(50px为圆形)
栗子:(给原生button按钮加属性)
.button123 {
border: none;
border-radius: 20px;
}
<button class:"button123">123</div>
Comments 1 条评论
博主 周思涵
阿巴阿巴 看这个就图一乐😺