学习CSS肯定绕不开的就是如何将css引入到HTML文件中，引入方式主要有三种：
内联样式、内部样式、外部样式
1、内联样式
内联样式又称行内样式，使用该样式需要直接在标签内添加“ style=" " ”，再将需要的样式写在双引号内，如
<div style="background: red">hello world!</div>1
行内样式比较适合初学者学习的时候使用，在网站开发时尽量不要去用，因为使用这种样式会把结构和CSS全部融合在一个页面里面，造成代码冗余，后期调整样式的时候非常不方便。
2、内部样式
内部样式是一种适合案例或者比较小的页面的引入方式，它的语法是在在head标签里添加style标签，再在style标签的内容区添加需要的样式，如：
<head>
<style type="text/css">
div{background: red}</style>
</head>12345
内部样式比较适合案例或者比较小的页面中，因为它也会增加HTML文件的代码量。
3、外部样式
外部样式是使用最广的引入方式，适合比较大的页面或者整站开发。引入方法是将样式写css文件中，再将css文件链接到HTML文件里。
而外部样式有两种链接方法引入HTML文件中：link和import
1）用link链接需要在html文件内添加link标签，在该标签内属性“ href=" " ”的双引号里写上css文件的路径即可。
<link rel="stylesheet" type="text/css" href="demo.css"/>1
2）用import链接需要用内部样式的方法添加“ @import url("")”属性，在url("")中写上css文件的路径。
<style> @import url("demo.css")</style>123
同为外部样式的链接方式，link和import之间的不同不仅是载入链接的语法不同：
本质上link是HTML标签，是HTML的写法，但是import是CSS的提供的一种链接方式。所以link能够引入除css以外的其它文件，而import只能引入css文件。
link是没有兼容问题的，但是import在IE5以下不支持。
加载顺序上也不一样，link是HTML结构和CSS样式同时加载，而import是先加载HTML后加载CSS。有时候网速比较慢，你就会看到只有文字和边框的难看页面，然后才看到比较好看的页面，就是因为这个网页使用import链接的样式。
在用js控制dom修改样式的时候，link可以被修改，但是import不可以。
为网页添加样式表的方法有四种。 1．最简单的方法是直接添加在HTML的标识符（tag）里： <Tag style=”properties”>网页内容</tag>举个例子： <p style=”color: bluefont-size: 10pt”>CSS实例</p>代码说明： 用蓝色显示字体大小为10pt的“CSS实例”。尽管使用简单、显示直观，但是这种方法不怎么常用，因为这样添加无法完全发挥样式表的优势“内容结构和格式控制分别保存”。 2．添加在HTML的头信息标识符<head>里：<head><style type=”text/css”><!--样式表的具体内容--></style></head>type=”text/css”表示样式表采用MIME类型，帮助不支持CSS的浏览器过滤掉CSS代码，避免在浏览器面前直接以源代码的方式显示我们设置的样式表。但为了保证上述情况一定不要发生，还是有必要在样式表里加上注释标识符“<!--注释内容-->”。 3．链接样式表 同样是添加在HTML的头信息标识符<head>里：<head><link rel=”stylesheet” href= http://www.webjx.com/htmldata/2005-04-08/ ”*.css” type=”text/css” media=”screen”></head>*.css是单独保存的样式表文件，其中不能包含<style>标识符，并且只能以css为后缀。 Media是可选的属性，表示使用样式表的网页将用什么媒体输出。取值范围：Screen（默认）：输出到电脑屏幕Print：输出到打印机TV：输出到电视机Projection：输出到投影仪Aural：输出到扬声器Braille：输出到凸字触觉感知设备Tty：输出到电传打字机All：输出到以上所有设备 如果要输出到多种媒体，可以用逗号分隔取值表。 Rel属性表示样式表将以何种方式与HTML文档结合。取值范围：Stylesheet：指定一个外部的样式表Alternate stylesheet：指定使用一个交互样式表 4．联合使用样式表 同样是添加在HTML的头信息标识符<head>里：<head><style type=”text/css”><!--@import “*.css”其他样式表的声明--></style></head>以@import开头的联合样式表输入方法和链接样式表的方法很相似，但联合样式表输入方式更有优势。因为联合法可以在链接外部样式表的同时，针对该网页的具体情况，做出别的网页不需要的样式规则。 需要注意的是：联合法输入样式表必须以@import开头。如果同时输入多个样式表有冲突的时候，将按照第一个输入的样式表对网页排版。如果输入的样式表和网页里的样式规则冲突时，使用外部的样式表。（以上资料来自网络，非本人原创）在IOS开发中，可以通过webView来加载HTML文件步骤如下：
1.需要有一个webView，可以通过storyboard拖拽一个 或者 alloc 一个（我在这里是拖拽了一个），是否要给webView设置delegate ，根据自己的需要决定（如果只是展示页面可以忽略）。
webView
2.创建HTML文件、CSS文件、js文件，同样的创建方式，只是后缀名不同。
New File ->Other ->Empty
创建HTML文件后缀名为：html，创建css文件后缀名为css，创建js文件后缀名为：js
创建HTML文件、CSS文件、js文件
这是创建完成后的样子
创建完成
3.在HTML文件，css文件，js文件中写入我们的代码。
在HTML文件中写入一些元素
<!DOCTYPE html>
<html>
<head lang="zh">
<meta charset="UTF-8">
<title>第一个HTML</title>
<link rel="stylesheet" type="text/css" href="index1.css">
<script type="text/javascript" src="index1.js"></script>
</head>
<body>
<h1>我是HTML</h1>
<p id = "p">p标签</p>
<img id = "img" src = "image.png" alt = "百度LOGO"><br/>
<a id = "a" href="[http://baidu.com]()">我要到百度</a>
<br/><br/><br/>
<button onclick = "hello()">点击我弹出hello</button>
</body>
</html>
在css文件中改变元素的属性
#p{
color:red
}
#img{
width:120px
height:50px
}
#a{
color:yellow
}
在js文件中写一个弹窗的函数
function hello(){
alert("hello")
}
这样我们的这三个文件就都写好了，可以通过webView来加载了 。
4.通过webView来加载这三个文件
在viewController的viewDidLoad方法中写入一下代码
