怎样运用css来控制页面
运用CSS对页面进行全方位的控制,主要的办法有四种:行内样式、内嵌式、链接式和导入式,下面我们来离别看一下这四种方式:
一、行内样式
1、特色:最为直接的一种。
2、运用方式
直接在HTML的标志中,运用style属性,将CSS代码写在其中。
3、举例注明
页面标题 正文内容1
正文内容2
正文内容3
4、评论
行内样式是最为简略的CSS运用办法,但因为需要为每一个标志设定style属性,后期保护老本仍然很高,并且网页容易过肥,因而不举荐运用。
二、内嵌式
1、介绍
内嵌样式表就是将CSS写在
与之间,并用标志进行声明。2、实例注明
页面标题 紫色、粗体、下划线、25px的结果1
紫色、粗体、下划线、25px的结果2
紫色、粗体、下划线、25px的结果3
3、剖析
(1)从例子中可以看出,所有的CSS代码局部被集中在了统一个区域,利便了后期的保护,页面也大大瘦身。
(2)但是,要是有多个页面,关于不一样页面上的
标志都但愿采纳一样的格调时,内嵌式就显得稍微费事,保护老本也不低。
(3)因而,内嵌式仅适用于对特别页面设定独自的样式格调。
三、链接式
1、地位
链接式CSS样式是运用频率最高,也是最为有用的办法。
2、方式
在HTML的
和标志之间加上语句:。3、实例
(1)CSS文件:1.css
h2{ color:#0000FF; } p{ color:#FF00FF; text-decoration:underline; font-weight:bold; font-size:20px; }
(2)HTML框架
页面标题 CSS标题1
紫色、粗体、下划线、25px的结果1
CSS标题2
紫色、粗体、下划线、25px的结果2
4、优势
将页面框架HTML代码与美工CSS代码完全别离,使得前期制作和后期保护都十分利便,一个CSS文件可以链接到多个HTML文件中。
四、导入式
1、功能相似于链接式,只是语法和运作方式上略有区别。
2、与链接式比拼
(1)采纳import方式导入的样式表,在HTML文件初始化时,会被导入到HTML文件内,作为文件的一局部,相似内嵌式的结果;
(2)链接式的CSS文件则是在HTML的标志需要格局时才以链接的方式引入。
3、常用的几种@import语句
可以选中任意一种放在标志之间。
@import url(1.css);
@import url('1.css');
@import url("1.css");
@import 1.css;
@import '1.css';
@import "1.css";
4、优点
(1)导入样式表的最大用场在于可以让一个HTML文件导入许多的样式表;
(2)不单是在HTML文件的标志中可以导入多个样式表,在CSS文件中也可以导入其他的样式表。
举荐教程:css迅速入门
以上就是怎样运用css来控制页面的细致内容,更多请关注 百分百源码网 其它相干文章!