7-在html使用css设置样式
css
css
定义如何显示 HTML 元素,用于控制Web页面的外观。通过使用CSS实现页面的内容与表现形式分离,可以提高工作效率 。
样式存储在样式表中,通常放在、<head>部分或存储在 外部CSS文件中
html中使用css
CSS 可以通过以下方式添加到HTML中:
- 内联样式: 在HTML元素中使用"
<style>
" 属性
<!DOCTYPE html>
<html>
<body style="background-color:yellow;">
<h2 style="background-color:red;">This is a heading</h2>
<p style="background-color:green;">This is a paragraph.</p>
</body>
</html>
- 内部样式表 :在HTML文档头部
<head>
区域使用<style>
元素 来包含CSS
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Test</title>
<style type="text/css">
h1 {color:red;}
p {color:blue;}
</style>
</head>
<body>
<h1>这是一个标题</h1>
<p>这是一个段落。</p>
</body>
</html>
效果:
- 外部引用 : 使用外部 CSS 文件
<head>
<link rel="stylesheet" type="text/css" href="mystyle.css">
</head>
href
表示要用的css文件的路径,相对路径或者绝对路径都可以。
最好的方式是通过外部引用CSS文件。
常用的一些文本样式
样式 | 含义 |
---|---|
background-color | 背景色:例如 red , rgb(255,0,0) , #FF0000 |
font-family | 字体,例如 arial、FangSong |
color | 字体颜色 |
font-size | 字体大小 |
text-align | 文字对齐方式,例如 center |
本文来自博客园,作者:aJream,转载请记得标明出处:https://www.cnblogs.com/ajream/p/15383568.html