您的位置:首页 > Web前端 > CSS

html+css的三种方式

2017-05-04 14:49 225 查看
html+css的三种方式

内联方式

内部样式表方式

外部引用CSS方式

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)</title>
<!-- 外部引用CSS方式 -->
<link rel="stylesheet" type="text/css" href="styles.css">
<!--style.css:
h3{
color:blue;
margin-left:20px;
}

p{
color:red;
}
-->
<!-- 内部样式表方式 -->
<style type="text/css">h2 {color:purple;margin-left:20px}</style>
</head>

<body>
<!-- 内联方式 -->
<h1 style="color:red;margin-left:20px;">内联样式</h1>
<p>在HTML元素中使用"style"属性</p>

<!-- 内部样式表方式 -->
<h2>内部样式表</h2>
<p>在HTML文档头部<head>区域使用<style>元素来包含CSS</p>

<!-- 外部引用CSS方式 -->
<h3>外部引用</h3>
<p>使用外部CSS文件</p>
</body>

</html>


效果图:

内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  html css