从零开始HTML#016——10分钟-Style 样式表

标签

#016_Apl_Sytle

当我们需要将网页装饰得比较漂亮的时候,就需要用到一种改变 HTML 元素的方法。那么今天这节课,我们就要来学习如何使用 style 属性改变页面。

在元素内部做样式

我们可以在大部分的 HTML 元素中,加入一个 style 属性,加入这个属性之后,设置这个元素的样式。这种方法可以高度自由的定制自己想要的样式。

h1、p 元素里面加入了 style 属性

效果图

我们通过 style 属性的 text-align 属性规定了元素中文本的水平对齐方式,font-family、color 以及 font-size 属性分别定义元素中文本的字体系列、颜色和字体尺寸。

当我们页面的内容越来越多的时候,通过这种对每个元素都进行单独定制的方法就显得相当的没有效率,这是用我们就要用到内联样式表。

使用内部样式表

在 HTML 文档的 head 部分,用 style 元素创建一个 css 样式表。编辑这一个全局有效的内部样式表,上面的所有属性都会对 HTML 内部同一的元素进行样式关联。

例如,style 样式表上,规定了 p 段落元素的颜色为 #9f6e56 (十六进制,当然rgb和直接输入颜色名也是可取的),那么在这个 HTML 文档中,所有没有自己特殊属性的 p 元素,就会连接到内联样式表规定的颜色。

记得删除元素内部的样式修改,除非你像保留它,作为特殊显示。

style 在 head 部分编辑的样式表

效果图

注意事项

在 HTML 4 中,有若干的标签和属性是被废弃的。被废弃(Deprecated)的意思是在未来版本的 HTML 和 XHTML 中将不支持这些标签和属性。这里传达的信息很明确:请避免使用这些被废弃的标签和属性!

以下标签都用 Style 替代:

居中——center

字体——font>

带删除线文本——s

带下划线文本——u

文本对齐方式——align

背景颜色——bgcolor

文本颜色——color

  • 发表于:
  • 原文链接:https://kuaibao.qq.com/s/20180703G1MH7O00?refer=cp_1026
  • 腾讯「云+社区」是腾讯内容开放平台帐号(企鹅号)传播渠道之一,根据《腾讯内容开放平台服务协议》转载发布内容。

扫码关注云+社区

领取腾讯云代金券