1 颜色属性
<div style="color:blueviolet">ppppp</div><div style="color:#ffee33">ppppp</div><div style="color:rgb(255,0,0)">ppppp</div><div style="color:rgba(255,0,0,0.5)">ppppp</div>
2 字体属性
font-size: 20px/50%/largerfont-family:'Lucida Bright'font-weight: lighter/bold/border/ 3 背景属性
border:1px solid red;
background-color: cornflowerblue;background-image: url('1.jpg');background-repeat: no-repeat;(repeat:平铺满)background-position: right(左右距离) top（上下距离）（20px 20px）;(横向：left center right)(纵向：top center bottom)简写：<body style="background: 20px 20px no-repeat #ff4 url('1.jpg')">
<div style="width: 300px;height: 300px;background: 20px 20px no-repeat #ff4 url('1.jpg')">
eg：
<!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><title>Title</title><style>span{display: inline-block;width: 18px;height: 20px;background-image: url("http://dig.chouti.com/images/icon_18_118.png?v=2.13");background-position: 0 -100px;}</style> </head> <body><span></span></body> </html>
4.文本属性
font-size: 10px;text-align: center; 横向排列line-height: 200px; 文本行高 通俗的讲，文字高度加上文字上下的空白区域的高度 50%:基于字体大小的百分比vertical-align:－4px 设置元素内容的垂直对齐方式 ,只对行内元素有效，对块级元素无效
text-indent: 150px; 首行缩进
letter-spacing: 10px; 字母间距
word-spacing: 20px; 单词间距
text-transform: capitalize; 单词首字母大写 5.边框属性
border-style: solid; 边框样式实线 dashed是虚线border-color: red; 边框颜色border-width: 20px; 边框宽度简写：border:边框宽度 边框颜色 边框样式，例如
border: 30px rebeccapurple solid;
border-left boder-right boder-top boder-bottom
6 列表属性
ul,ol{ list-style: decimal-leading-zero;list-style: none; 除去列表样式
list-style: circle;list-style: upper-alpha;list-style: disc; }
7 dispaly属性
none 隐藏
block 块元素
inline 内联元素
inline-block 内联元素具有块元素属性
8.eg：表格居中
#div1 {text-align: center;}#div2 {margin:50px auto;border: 5px red dashed;width: 500px;height: 500px;}</style></head> <body> <!--action 定义表单数据提交地址--><div id="div1"> <div id="div2"> <form action="http://127.0.0.1:8000/post_info" method="get" enctype="multipart/form-data"><!--单行文本框--><input type="text" name="username" placeholder="请输入账号"><br><br><!--密码框--><input type="password" name="password" placeholder="请输入密码"><br><br><!--单选框-->性别：<label><input type="radio" name="sex" value="1">男</label><label><input type="radio" name="sex" value="2">女</label><!--多选框--><br><br>最喜欢的游戏：<label><input type="checkbox" name="fav" value="LOL">英雄联盟</label><label><input type="checkbox" name="fav" value="shoot">喷射战士</label><label><input type="checkbox" name="fav" value="zelder">塞尔达传说</label><label><input type="checkbox" name="fav" value="mario">马里奥</label><!--上传图片--><br><br><input type="file" name="pic"><!--多行文本框--><br><br><textarea name="text" cols="30" rows="10"></textarea><!--下拉列表--><br><br><select name="city"><option value="gz">广州</option><option value="sz">深圳</option><option value="zh">中山</option></select><!--提交表单--><input type="submit" value="提交"><!--重置表单--><input type="reset" value="重置"> </form> </div> </div>
参考：https://www.cnblogs.com/yuanchenqi/articles/5977825.html
