CSS 与 HTML文档的结合方法

2021-09-26 23:01:06 阅读：164 来源： 互联网

CSS 与 HTML文档的结合方法

css控制网页内容显示格式的方式是通过许多定义的样式属性（乳字号，段落控制等）实现的，并将多个样式属性定义为一组可供调用的选择符。选择符就是某个样式的名称，称之为选择符的原因是，当HTML文档中某元素要使用该样式时，需利用该名称来选择样式
想让浏览器显示出样式就需要让浏览器识别调用。这里介绍4种页面中插入样式表的方法：定义内部样式表，定义行内样式表，链入外部样式表环绕导入外部样式表。
1.定义内部样式表
内部样式表是指吧样式表到页面的head区内，这些定义的样式就应用到页面中，样式表是用style标签插入的。定义的样式表可以再整个HTML文档中调用。可以在HTML文档中html和body标签之间插入一个style标签对，在其中定义样式
内部样式表格格式：

<style type='text/css'>
	<!--
		选择符1{属性:属性值;属性:属性值;}
		选择符2{属性:属性值;属性:属性值;}
		...
		选择符n{属性:属性值;属性:属性值;}
	-->
</style>

其中style标签用来声明所要定义的样式，type属性指定style使用css的语法来定义。属性与属性值用 ‘:’ 隔开；定义之间用“ ； ”隔开。

组合选择符的格式：
组合选择符可以减少重复定义的麻烦，当多个选择符具有相同的样式时就可以使用组合选择符。
2.定义行内样式表
行内样式表也称为内嵌样式表，是指在html标签中插入style属性，在定义要显示的样式表，而style属性就是css属性的属性和值。这种方法可以很轻松地对某个单独的标签进行定义样式。而且这种样式只对定义的标签起作用不会影响页面整体样式。
行内样式的格式为：

<标签 style="属性:属性值;属性:属性值...">

此种方式不推荐使用，因为再做大型项目时比较麻烦

3.链入外部样式表
链入外部样式表就是当浏览器读取到HTML文档的样式，将会想链接外部样式表文件索取样式。先将样式表保存为一个样式表文件（css）然后再网页中用link标签链接这个样式表文件。
格式：

<head>
	...
	<link rel='stylesheef' href='外部css文件地址' type='text/css'>
	...
</head>

如果将一个样式表链入到多个html文件，当这个样式表改变时，所有页面样式都会改变。因此在制作大量相同样式时这种方法是非常好用的。

4.导入外部样式表
导入外部样式表就是当浏览器读取HTML文件时，复制一份样式表到这个HTML文件中。即在内部表的style标签中导入一个外部样式表文件。
格式为：

<style tyle='text/css'>
	@import url('外部样式表地址1.css');
	@import url('外部样式表地址2.css');
	...
</style>

他与链入外部样式表的区别是他是导入即复制一份文件到内部，一般采用链入的方式。

标签：选择符,定义,样式,HTML,文档,样式表,CSS,属性
来源： https://blog.csdn.net/weixin_52915467/article/details/120494233

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9

CSS 与 HTML文档的结合方法

CSS 与 HTML文档的结合方法