CSS常见样式
1.color属性
举例：
h1 {
color: red;
background-color: rgba (0,0,0,0.2); //RGBA是代表Red（红色） Green（绿色） Blue（蓝色）和 Alpha的色彩空间，也就是透明度/不透明度
}
把h1标签设为红色，把h1和red设为你需要的即可。
补充一点东西
#000 黑色
#fff 白色
#eee 淡灰色
#ccc 灰色
#666 深灰色
#333 深黑色
#f00 红色(是零零不是哦哦)
#0f0 绿色
#00f 蓝色
2.background属性:如何定位背景图像
举例：
h1 {
background: black; //背景色为黑
background-color: #000; //也是颜色，十六进制的写法。
background-image: url(images/bg.gif); //设置背景图片
background-repeat: no-repeat; //背景不重复
background-position: center; //背景图片居中
}
3.border属性：边
举例：
h1 {
border: 1px solid yellow; //1px实心的黄色边框。这三个值都可以改为自己需要的。
border-top: 1px solid yellow; //也可以加方位上下左右。top，bottom，left，right。
border-radius: 3px; //设置圆角3像素
border-radius: 50%; //成圆形
}
4.Margin 和 Padding属性
举例：
什么是margin，padding，其实就是边距。↓
h1 {
margin-top: 10px; //上设为10像素
margin-right: 5px;
margin-bottom: 10px;
margin-left: 5px;
margin: 10px 5px 10px 5px; //可以简写为这样，顺序是上右下左。
padding: 11px;
}
5.Font属性
font-size: 12px; 字体大小
font-family: Arial; 字体，宋体，微软，Arial等。
font-weight: 文字粗度，常用默认regular和粗体bold。
font-height: 行高
font: 14px/1.4 Arial; 字体大小，行高，字体
6.Text属性
举例：
a {
text-align: center; //文本对齐方式，此外有left，right，justify(两端对齐)
text-indent: 2px; //首行缩进
text-decoration: none; //文本装饰，none是去掉下划线(HTMLa标签会默认有下划线，设为none即可)line-through(删除线)，underline(下划线)，overline(顶部的线)
text-transform: uppercase; //改变文字大小写。uppercase小改大，lowercase大改小，capitalize首字母大写。
word-spacing: 改变字之间的间距
letter-spacing: 改变字母与字母的间距
}
7.float属性 浮动
举例：
ul {
float:left; //向左浮动
float: right; //向右浮动
}
使用浮动必须给父元素清除浮动,不然可能会出问题，给父元素加上这句就行：
.clearfix:after {
content: '';
display: block;
clear: both;
}
这就像数学中的固定公式一样
8.透明or隐藏
举例：
opacity: 0; 透明度为0
risibility: hidden; 和↑类似
display: none; 消失
background-color: rgba (0,0,0,0.2); 只背景色透明
9.display属性 指定元素的显示类型
了解这个先要讲解下块级元素和行内元素。
行内元素：
自己的独立空间，它是依附于其他块级元素存在的，因此，对行内元素设置高度、宽度、内外边距等属性，都是无效的。比如a标签。样式是行内元素，因此对a元素设置高度、宽度等属性，都是无效的。
块级元素
比如div，p，li，img等默认情况下的display属性值就是“block”。所以对于链接a来说只能这样：display: inline;改为display: block;强制将它改成块元素。看代码。
<span style="display:block;">block属性</span> //这样才能给span行内元素设置宽高等
display: block;
display: inline;
display: run-in;
display: flow;
display: flow-root;
display: table;
display: flex;
display: grid;
display: ruby;
用法较多，可点击MDN查看
10.其他
举例:
h1:hover {
border-bottom: 1px solid orange; //鼠标放上时底边出现1px的橘色边,鼠标移开则消失。
}
ul {
list-style: none; //去掉ul列表中默认的点"."
}
p {
overflow: hidden; //后面多出的文字隐藏
white-space: nowrap; //不折行，一直写出文本框
text-overflow: ellipsis; //超出文本内容变成...格式
}
暂时想到这么多，一般情况下够用，有需要的可以MDN查询。
