本文所分享的知识点是【网页引入css样式的几种方法】，欢迎您喜欢我爱IT技术网所分享的教程、知识、经验或攻略，下面是详细的讲解。
网页引入css样式的几种方法
内联式样式表：直接写在现有的标记中，比如：
<p style="font-size:24px;">www.bitsCN.com</p>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "<a href="http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd</a>">
<html xmlns="<a href="http://www.w3.org/1999/xhtml">http://www.w3.org/1999/xhtml</a>">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>CSS在网页中应用的方式_内联式</title>
</head>
<body>
<p style="font-size:24px;">0.5秒三分绝杀!波特兰上演波什时刻 第N次拯救热火</p>
<h1 style="font-weight:normal; color:#900;">玩命暴扣扳平+助攻绝杀三分 热火太幸运有这颗队魂</h1>
<p>热火今夜还一功臣必须赞 11分不多但却分分是金!</p>
<p>詹波为小弟恶犯叫屈 当事人他都起飞了!肯定假摔</p>
<p>斯帅称客战开拓者奥登不打 波什：他很快就可复出</p>
</body>
</html>
嵌入式样式表：使用<style></style>标签嵌入到HTML文件的头部中<head>标记中，如：
<style type="text/css">
p{font-size:18px; color:#093;}
</style>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "<a href="http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd</a>">
<html xmlns="<a href="http://www.w3.org/1999/xhtml">http://www.w3.org/1999/xhtml</a>">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>CSS在网页中应用的方式_嵌入式</title>
<style type="text/css">
p{font-size:24px; color:#F03;}
</style>
</head></p>
<p><body>
<p>0.5秒三分绝杀!波特兰上演波什时刻 第N次拯救热火</p>
<h1>玩命暴扣扳平+助攻绝杀三分 热火太幸运有这颗队魂</h1>
<p>热火今夜还一功臣必须赞 11分不多但却分分是金!</p>
<p>詹波为小弟恶犯叫屈 当事人他都起飞了!肯定假摔</p>
<p>斯帅称客战开拓者奥登不打 波什：他很快就可复出</p>
</body>
</html>
外链式：使用<link>标签调用CSS文件（开发中用这种方式）
CSS在网页中应用的方式.css
@charset "utf-8";
body{
font-size:18px;
background:#FF0;
font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
font-family:'汉仪行楷简'
}
div{
font-size:24px;
background:#0F0;
font-weight:bold;
width:60;
height:90;
}
span{
font-size:12px;
font-weight:normal;
}
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "<a href="http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd</a>">
<html xmlns="<a href="http://www.w3.org/1999/xhtml">http://www.w3.org/1999/xhtml</a>">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>CSS在网页中应用的方式_</title>
<link href="http://www.bitscn.com/school/HTMLCSS/201401/CSS在网页中应用的方式.css" rel="stylesheet" type="text/css" />
</head>
<body>
<h1>李克强主持召开<span>国务院</span>常务会议</h1>
<h2> 听取最低生活保障政策落实督查情况汇报</h2>
部署进一步加强和改进低保工作
<div>决定将《社会救助暂行办法（草案）》向社会公开征求意faksdjfkasfkasdfj</div>
</body>
</html>
导入式：也可以使用导入方式import,但这种方式和内嵌式一样会占用网页文件的大小，并且有的浏览器解析会有问题，就是先显示网页内容在给网页内容加样式
<style type="text/css">
@import url(css文件)
</style>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "<a href="http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd</a>">
<html xmlns="<a href="http://www.w3.org/1999/xhtml">http://www.w3.org/1999/xhtml</a>">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>CSS在网页中应用的方式_导入式</title>
<style type="text/css">
@import url("CSS在网页中应用的方式.css");
</style>
</head></p>
<p><body>
<h1>李克强主持召开<span>国务院</span>常务会议</h1>
<h2> 听取最低生活保障政策落实督查情况汇报</h2>
部署进一步加强和改进低保工作
<div>决定将《社会救助暂行办法（草案）》向社会公开征求意faksdjfkasfkasdfj</div>
</body>
</html>
关于网页引入css样式的几种方法的相关讨论如下：
相关问题：在html中引入CSS样式的方式，请分别叙述？
答：有三种方式： 1、内联：在HTML标签内用style属性添加CSS，如： 字体大小为12像素 2、外联：在HTML的head区块内用...标签来添加CSS，如： .zt {font-size:12px} 字体大小为12像素 3、导入或链接：把CSS放入单独的文件，然后通过Import或Link连接... >>详细
相关问题：HTML中引入CSS样式有几种形式
答：一般来说只有3种： 1.最常用的，引入样式表，在样式表中编写样式，引入方式如下： 2.在Html头部用包起来，在这里面编写样式： *{ padding: 0;margin: 0 } 3.在标签里面直接编写行内样式。 当然还有一种方式是用JS直接更改或者赋值给某个标签，但... >>详细
相关问题：Dreamweaver中插入网页样式css样式/文件位置有哪几...
答：一般添加css样式表的方式有3种！ 一种是引入css样式表，引入css样式表一般用link的方式引入，代码如下 如果对写代码不是很流利的话可以用DW 手动引入，操作步骤图片如下： 选择好了点击确认就可以了。添加好了之后你会看到就是上面所示的代码！ ... >>详细
- 评论列表（网友评论仅供网友表达个人看法，并不表明本站同意其观点或证实其描述）
-