HTML 样式 - CSS
CSS (层叠样式表-Cascading Style Sheets) 用于定义页面样式.
样式和颜色
亲自试一试 - 例子
在HTML内部使用样式
示例演示了如何在<head> 内部添加样式信息
让链接地址没有下划线
示例演示了如何通过样式属性使链接没有下划线
链接一个外部样式表
示例演示了使用<link>标签链接一个外部样式表
Css样式
CSS和HTML4一起介绍,为了提供更好的方式定义HTML元素样式
CSS可以通过如下方式添加到HTML中:
- 行内使用 - 在HTMl元素中使用样式 属性
- 内部引用 - 在头部使用<style> 元素
- 外部引用 - 使用外部样式 文件
添加样式的首选方式是将样式单独放到样式文件内
不过,在我们这套HTML手册中我们会使用样式属性向您介绍css.这是为了简化例子,也能让您容易编辑代码并且亲自试一试
你可以在CSS手册中学到关于CSS的一切内容
行内样式
在某个单一元素上添加某个样式,可以使用行内样式
在行内使用样式,可以在相关标签内使用style属性.style属性可以包含css的任何属性。下面的例子展示了如何改变文本演示和改变段落的左侧边距:
学习更多CSS内容,请查看CSS手册
样式的例子 - 背景色
背景色属性定义了元素的的背景颜色:
例子
<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>
亲自试一试 »
background-color属性废弃了过去的bgcolor属性。
样式例子 - 字体、颜色、大小
字体,颜色,字体大小属性定义了元素中文本的字体,颜色,和大小:
例子
<html>
<body>
<h1 style="font-family:verdana;">A heading</h1>
<p style="font-family:arial;color:red;font-size:20px;">A paragraph.</p>
</body>
</html>
亲自试一试 »
字体,颜色,和字体大小属性废弃了过去的<font>标签
样式元素 - 文本对齐方式
文本对齐属性是指一个元素的水平对齐方式:
例子
<html>
<body>
<h1 style="text-align:center;">Center-aligned heading</h1>
<p>This is a paragraph.</p>
</body>
</html>
亲自试一试 »
过去使用的<center>文本居中标签已被废弃
内联样式表
内联样式表被用于控制当前页面某个元素的样式。内联样式定义在<head>内部,使用<style> 标签,例如:
<style>
body {background-color:yellow;}
p {color:blue;}
</style>
</head>
弃用的标签和属性
在HTML4中,一些标签和属性被用于控制文档样式。这些便签将在新版本不被支持
避免使用的元素:<font>, <center>, and <strike>,属性:color和bgcolor