01 - css层叠样式表

最新推荐文章于 2024-09-11 20:31:47 发布

前端人，前端魂

最新推荐文章于 2024-09-11 20:31:47 发布

阅读量110

点赞数

分类专栏： css入门文章标签： css html html5

本文链接：https://blog.csdn.net/weixin_46468143/article/details/120704384

版权

4 篇文章 0 订阅

订阅专栏

引入css样式表

1. 行内式
通过标签的style来设置元素的样式

<p style = '属性：属性值;'> 内容</p>

	任何的HTML都可以设置 style属性
	注意：
		style其实是标签的属性
		样式属性和值中间用 ：
		多个属性用 ； 隔开
		只能控制当前的标签，造成代码冗余
	缺点
		没有实现样式和结构相分离

3. 内嵌样式
概念：将css代码写在HTML文档中的 head头部标签中，并且用style标签定义

<head>
<style>
选择器{
属性：属性值
}
div {
color:red; /*字体颜色为红色*/
font-size:20px; /*字体大小为20像素*/
}
</style>
</head>

注意：
style标签一般位于head标签中，当然理论上也可以放在HTML中的任何地方
只能控制当前页面

缺点
没有彻底分离

5. 外部样式
概念：将所有的样式放在一个或多个 .CSS的文件中，通过 link 标签将外部样式表文件连接到 HTML 文档中
语法

<head>
	<link rel='stylesheet' type = 'text/css' href = 'css文件路径'
</head>

注意
link是单标签
link标签需要放在head头部标签中，并且指定link标签的三个属性