CSS代码书写位置
<div style="width: 100px;height: 100px; font-size: 14px;">1</div>
② 内联式缺点
a. 内联式必须写在标签上,没有完全脱离HTML标签。
b.css样式代码让标签结构繁重,不利于HTML结构和解读。
c.一个内联式的CSS代码,只能给一个标签使用,如果多个标签有相同的样式,同样的CSS代码徐奥书写多次,增加代码量。
因此,实际工作中不会使用内联式(行内式)编写CSS代码。
2. 内嵌式
① 内嵌式简介
书写位置:在HTML文件中,<head> 标签内部有一个<style> 标签。
<style> 标签书写在<title> 标签后面,所有CSS代码书写在<style> 标签内部。
<style>标签有意标签属性叫做type,属性值是“text/css”。
<style type="text/css"> div { width:100px; height:100px; background-color:pink; } </style>
② 内嵌式特点
优点 | 缺点 |
a.实现了结构和样式的初步分离,css只负责样式,HTML负责结构。 b.多个标签可以利用一段代码设置相同的样式,节省代码量。 |
a.结构和样式并没有完全分离,代码依旧写在HTML吻技安的<style>标签内部。 b.css样式只能给一个HTML文件使用,不能够被多个HTML文件同时利用。 c.在HTML中如果CSS代码太多,会造成文件头重脚轻。 |
3.外联式
<link rel="stylesheet" href="目标文件路径.css" type="text/css">
优点:
a. 实现了HTML和CSS完全分离
b.多个HTML文件可以公用一个CSS文件,便于提取公共CSS,减少代码
4.导入式
<style> @import url(css/01.css); div { border-color: #00f } </style>
导入式问题:
<style> div { width: 200px; height:200px; background-color: skyblue; margin-bottom: 10px; } </style>
2.英文大小写
CSS中的英文可以用大写,也可以用小写。
建议:CSS中的选择器和样式属性名,属性值等都使用小写英文特殊情况除外。
原文:https://www.cnblogs.com/0902-zjq/p/14258588.html