CSS样式的三种引入方式
程序员文章站
2022-04-28 08:04:35
...
css引入方式
1 css引入方式一_行内
- 行内样式:
- 在HTML标签中添加属性
style="属性:属性值" - 作用域最小,作用当前标签; 行内样式的优先级最高
- 在HTML标签中添加属性
<body>
<h3 style="color: red;">h3标签</h3>
<h3>哈哈</h3>
</body>
2 css引入方式二_内部
- 内部样式:
- 在HTML页面里面写CSS代码, 一般写在中, 使用标签
style, 属性:type="text/css" - 作用是当前整个页面有效
- 在HTML页面里面写CSS代码, 一般写在中, 使用标签
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
h3{color: chocolate;}
</style>
</head>
<body>
<h3>h3标签</h3>
<h3>哈哈</h3>
</body>
</html>
3 css引入方式三_外部
- 外部样式:
- CSS样式定义在另一个文件中,
后缀名.css(文本文件) - 在HTML页面中,引入样式表, 使用link标签 写在head中
- 属性:
href="css文件路径" | type="text/css" | rel="引入的文件和当前页面是什么关系"
- 属性:
- 作用范围最大,哪个页面引入,哪个有效
- CSS样式定义在另一个文件中,
<html>
<head>
<meta charset="UTF-8">
<title></title>
<link href="css/1.css" type="text/css" rel="stylesheet"/>
</head>
<body>
<h3>h3标签</h3>
<h3>哈哈</h3>
</body>
</html>
css/1.css
h3{
color: blue;
}
上一篇： CSS学习
下一篇： Java多线程编程的方法总结（附示例）