上海建设银行网站上班时间表,wordpress主题汉化,万寿路网站建设,好看的个人工作室源码文章目录1. 基本语法规范2. 三种引入方式1. 基本语法规范 CSS 的基本语法规范是由 选择器 和 若干个声明 组成的。 选择器选中一个元素之后#xff0c;这些属性都是针对于这个元素展开的。 先来看一个没有 CSS 的效果。
bodyp这是一个段落/p
/bo…
文章目录1. 基本语法规范2. 三种引入方式1. 基本语法规范 CSS 的基本语法规范是由 选择器 和 若干个声明 组成的。 选择器选中一个元素之后这些属性都是针对于这个元素展开的。 先来看一个没有 CSS 的效果。
bodyp这是一个段落/p
/body可以看到此时只是显示出了内容并没有什么特殊的效果接下来我们引入 CSS代码。 这里的 style 标签可以放到任意位置推荐的位置是 head 标签中。
bodystylep {color: red;}/stylep这是一个段落/p
/body上述 style 标签里的 p 标签就是一个选择器它所描述的就是当前代码中所有的 p 标签。 大括号里面的内容就是要针对这所有的 p 标签设置成什么样的属性。
上述的属性就是将字体颜色设置成 红色。 大括号里的 CSS 属性可以是一个或者多个每个属性都是一个键值对 键和值之间使用 : 分割。键值对之间 ; 分割。每个键值对可以独占一行也可以不独占一行。 下面来演示多个属性
bodystylep {color: red;font-size: 40px;}/stylep这是一个段落/p
/body上述的 font-size 属性就是将字体大小设置为 40像素 。
2. 三种引入方式 1、内部样式
使用 style 标签直接把 CSS 写到 html 文件当中此时的 style 标签可以放到任意位置一般建议的是放到 head 标签中。 这个方式在上述的 基础语法规范演示过了下面不再演示。 2、内联样式
使用 style 属性针对指定的元素设置样式。此时不需要写选择器直接写属性键值对 这个时候的样式只针对当前的元素有效。
bodyp stylecolor:green; font-size: 40px;这是一个段落/pp这是另一个段落/p
/body上述代码里的属性只针对第一个 p 标签有效对于第二个 p 标签无效。 当 内部样式 与 内联样式 冲突时内联样式优先。
!DOCTYPE html
html langen
headmeta charsetUTF-8meta http-equivX-UA-Compatible contentIEedgemeta nameviewport contentwidthdevice-width, initial-scale1.0title我真帅/titlestylep{color: red;}/style/head
bodyp stylecolor:green; font-size: 40px;这是一个段落/pp这是另一个段落/p
/body
/html可以看到内部样式只对第二个 p 标签生效。 3、外部样式
把 CSS 文件单独作为一个**.css文件**再通过 link 属性让 html 引入该 css 文件。
!DOCTYPE html
html langen
headmeta charsetUTF-8meta http-equivX-UA-Compatible contentIEedgemeta nameviewport contentwidthdevice-width, initial-scale1.0title我真帅/title
/head
bodyp这是一个段落/pp这是另一个段落/p
/body
/html以下是 .css 文件需要注意的是如果没有通过 link 属性引入是不会起到作用的。 上述就是一个 .CSS文件。 可以看到在以上并没有使用 link 属性引入这个文件的时候此时不会有任何的效果。 link 属性也是建议写到 head 标签里面。 link relstylesheet hrefstyle.csshref 里填写的就是你的 .CSS 文件名。 可以看到此时就起了效果。
