CSS3基础知识解析（一） |【实用干货】
随着岗位竞争的越来越激烈，而设计师掌握的技能要求也越多，设计师不光只会设计，而且也要懂（会）代码（会手写代码更会加金的），所以我们要做一位懂代码设计师，还好Jason在大学学过代码，毕业也做过一段时间的设计+前端，我将我在代码方面的知识总结分享给大家，赶紧往下看吧
1、对css的认识
html 控制网页的内容与结构
css 控制网页的表现：表现包括文字的字体、大小、颜色、背景等等，配合div标签，其实也能控制页面的排版
2、css的语法
选择器{声明} 声明是 属性名：属性值； 在大括号中可以加上很多条声明，每条声明代表着一种格式
h1{
color:red;
font-size:18px;
font-family:宋体;
font-weight:normal;
} 注释：此为标签选择器，标签为h1
h2{
color:red;
font-size:18px;
font-family:宋体;
font-weight:normal;
} 注释：此为标签选择器，标签为h2
.aa{
color:red;
font-size:18px;
font-family:宋体;
font-weight:normal;
} 注释：此为类选择器，名称为aa（注意事项见下方）
#bb{
color:red;
font-size:18px;
font-family:宋体;
font-weight:normal;
} 注释：此为id选择器，名称为bb（注意事项见下方）
3、css如何控制网页页面效果
（1）行内控制：<p style="color:#f00; background:#ccc; font-size:12px;">我是一个兵</p>
即将css的声明采用style="" 的方式加以表达，css的使用类似于网页标签中的一个属性
（2）内嵌方式：在网页<head></head>中加入一段代码： 注释：只需要加入<style>标签，然后在此标签中加入css语句即可
例如 <style type="text/css">
h1{
color:red;
font-size:12px;
}
</style>
在<style type="text/css"></style>中间可以加入各种css的语句
（3）链接方式：需要在<head></head>之间加上<link href="url" type="text/css" rel="stylesheet" />
css的语句放在一个单独的，后缀名为.css的文件当中。这种方式是目前用的最为广泛的一种方式，因为可以让多个html文件共用
一个css文件，不用重复劳动。
（4）导入方式：导入样式和链接样式比较相似，采用import 方式导入css 样式表
这四种方式的优先级是：行内控制>内嵌方式>链接方式>导入方式
4、css的选择器
css 选择器共有三种：标签选择器、id 选择器、类选择器。
标签选择器：实质上是重新定义标签的格式，名字必须是标签的名字，它的好处是标签的格式一旦被重新定义，在所有的网页中都会随之发生改变。
id选择器：定义时用#，运用时与id相配合，名字可以随意取(但不能与标签名相同)，但id只能用一次。id选择器往往用于页面的排版，所以往往只用一次。
<div id="bb">
对此可以酣高楼
</div>
类选择器：定义时用. 运用时与class相配合，名字可以随意取，而且可以无限制的被使用，只要使用的场合中所需要的格式是一样的就行。
<p class="aa">长风万里送秋雁</p>
5、给网页加上css的通用步骤
1、给一个网页加上css，首先是要让网页出现css的声明 (行内、内嵌、链接、导入，一般用内嵌或链接)
2、再加上css的语句，前提是要懂得加上何种类型的css选择器
3、在需要加上css效果的地方加入id= 或 class= 的语句
注释：当网页中的文本没有标签时，或者标签不够用时，我们可以为文字加上标签，用以承载css
（待续…）
# 越努力，越幸运！#
精选 | 干货 | 经验 | 分享
UI范儿 | 越努力，越幸运
【UI范儿交流群开放中】
QQ群：325192599
微信ID：UIfaner