7.13 CSS
一.字体设置样式
1.字体系列：p 标签{ font-family:"宋体";}一般都是微软雅黑，写英文比较好：microsoft Yahei
2.字体大小：font-size 20px;
3.字体粗细： font-weight bold(粗体)
4.字体样式：font-style 正常：normal 斜体：italic 强制倾斜：oblique
5.color：三种设置颜色方式（1）英文单词 （2）rgb：133，45，200 rgb：20%，35%，50%
（3）十六进制：00-ff color:#00ffcc
body {
font-style: italic;
font-weight: bold;
font-size: 20px;
line-height: 1.6em;
font-family: "宋体", sans-serif;
}
上面样式简写：
body{
font:italic bold 20px/1.6em "宋体",sans-serif;
}
二.文本样式
1.text-decoration ：三种方式：overline:线在头上 underline：线在下 line-through：线从中间过，一般用于打折。
2.开头空两格首行缩进：p{text-indent:2em;}
3.文字设置行间距：p{line-height:1.5em;}
4.文字间隔设置：（1）字母间隔：letter-spacing：20px （2）文字间隔：word-spacing：30px
5.排列方式：文本对齐方式：text-align：center，left,right
6.长度值：px（像素） em 百分比相对单位
px：90px=1英寸
em：font-size=14px ;text-indent:2em; 2em=2*14=28px;首行缩进28px，两个字体大小
特殊情况：但当给 font-size 设置单位为em时，此时计算的标准以 p 的父元素的 font-size 为基础。如下代码：
html:
<p>以这个<span>例子</span>为例。</p>
css:
p{font-size:14px}
span{font-size:0.8em;}
结果 span 中的字体“例子”字体大小就为 11.2px（14 * 0.8 = 11.2px）。
%百分比：p{font-size:12px;line-height:130%}
设置行高（行间距）为字体的130%（12 * 1.3 = 15.6px）。
三.元素分
1.块状元素，内联元素，内联块状元素
常用的块状元素有：
<div>、<p>、<h1>...<h6>、<ol>、<ul>、<dl>、<table>、<address>、<blockquote> 、<form>
常用的内联元素有：
<a>、<span>、<br>、<i>、<em>、<strong>、<label>、<q>、<var>、<cite>、<code>
常用的内联块状元素有：
<img>、<input>
2.块状元素：独占一行 p{ display:block;}
3.内联元素：我要和你站在一起 div{display:inline}
内联元素特点：
1、和其他元素都在一行上；
2、元素的高度、宽度及顶部和底部边距不可设置；
3、元素的宽度就是它包含的文字或图片的宽度，不可改变。
4.内联块状元素：div{ display:inline-block;}
inline-block 元素特点：
1、和其他元素都在一行上；
2、元素的高度、宽度、行高以及顶和底边距都可设置。
3.不显示元素：display:none;
4.边距：margin:外边距 padding:内边距 border:边框
5.背景色
div{ background-color:green;}/***快内元素***/
a{ background-color:blue}/*****行内元素*****/
6.border添加边框
（1）border-width:宽度；thin | medium | thick（但不是很常用），最常还是用像素（px）。
border-style:solid 实线 dashed：虚线 dotted:点线
border-color:#CCC 十六进制颜色
p{ 2px dotted #ccc}
（2）边框：
border-top:1px solid red;脚下踩线
border-right:1px solid red;
border-left:1px solid red;
