三、如何用CSS控制页面？
发布于：2015-11-17 17:32
1.内嵌式
在<head>中写入样式
<head>
<style type="text/css">
<!--
.STYLE1 {color: #FFFFFF}
-->
</style>
</head>
2.行内样式
<html>
<head>
<title>行内样式</title>
</head>
<body>
<p style="color:#FF0000; font-size:20px; text-decoration:underline;">正文内容1</p>
<p style="color:#000000; font-style:italic;">正文内容2</p>
<p style="color:#FF00FF; font-size:25px; font-weight:bold;">正文内容3</p>
</body>
</html>
3.html
共有13条评论
正序查看
倒序查看
0
今日新帖
0
昨日新帖
6
帖子总数
推荐
换一组
HTML5 CSS3 JS 各种JS框架集干货合集～
Dreamweaver 2015-06-04 10:35
浓缩的精华！从零开始带你认识最新的图片格式WEBP
Dreamweaver 2015-11-18 08:56
经验之谈！前端工程师的简历到底要怎么写？
Dreamweaver 2015-11-20 17:39
进阶篇——什么时候应该避免写代码注释？
Dreamweaver 2015-11-30 15:25
不是我开玩笑，2018 年你还需要学习 JavaScript
Dreamweaver 2017-12-27 19:42
【干货】一名专业的前端开发工程师都能拿多少钱？
Dreamweaver 2018-09-07 14:59
3.链接式:使用频率最高,最实用的方法。它将html页面内容本身和css代码分离成两个或多个文件，使得前期制作和后期维护十分方便，使网站的后台技术人员和美工设计者很好的分工合作。同时同一个css文件可以链接到几个网页甚至整个网站的所有页面，使得整个网站整体风格统一协调。它也是本门课程讲解的重点。
<head>
<link rel="stylesheet" rev="stylesheet" href="style.css" type="text/css"/>
</head>
例：链接式网页：
<html>
<head>
<title>使用了链接样式的网页！</title>
<link href="1.css" type="text/css" rel="stylesheet">
</head>
<body>
<h2>CSS标题1</h2>
<p>紫色、粗体、下划线、25px的效果1</p>
<h2>CSS标题2</h2>
<p>紫色、粗体、下划线、25px的效果2</p>
</body>
</html>
4.导入式
<head>
<style type="text/css">
<!--
@import url(1.css);
-->
</style>
</head>
和链接式很相似，在一个网页中可以同时导入几个样式表。缺点在使用时是先加载内容再把相关的CSS代码加载进来,在打开网页速度较慢时,有可能会出现内容显示了,但CSS代码还未加载进来,使网页暂时看起来很丑,因此不推荐使用。
样式优先级：
行内样式 > link样式 > 内嵌样式 > import样式
备注：在网页中使用CSS有几种方法，建议在建站时最好只使用其中的
1种或两种方法，这样有利于后期的维护和管理。也不会现各种样式撞车
的情况。
猴塞利~~
回复:三、如何用CSS控制页面？