31 CSS3的基本语法和注释

2022-12-26 0 776

CSS3的基本上句法

CSS3的句法比较简单,如下表所示图:

31 CSS3的基本语法和注释

1 先写示例,示例是优先选择页面上的某三个原素。

2 接着在示例的前面写三个字符,也能不写字符,但当你序列化页面标识符的这时候,示例前面的字符就会手动被加进上。

3 接着再写三个四元组对,在按键上是拉丁字母p前面的三个键。

4 四元组里头是现阶段那个示例的式样的详列,式样的方式是—-

k:v;k:v;k:v

每三个k:v就叫两条式样。

k是特性名,v是特性的值。

特性名和特性值之间用英文的冒号隔开,冒号前面能有三个字符,也能没有字符。

每三个k:v和另三个k:v之间,必须用英文的分号隔开。

5 每三个示例的最后两条式样,是能不写分号的。如下图:

31 CSS3的基本语法和注释

6 CSS的每两条式样,也能不换行。比如这样写:

31 CSS3的基本语法和注释

当然不换行的写法,也是符合CSS3的句法规范的,只是这样写显得有点凌乱。

当然在vscode编辑器里,写css的这时候,冒号和分号是手动补全的,基本上上也不会出现编写错误。

CSS3的注解

CSS3的注解是这样写的:

/**/

比如:

31 CSS3的基本语法和注释

在CSS标识符或CSS文件中,按Ctrl+/快捷键,能快速形成注解。

现在我在项目文件夹中创建三个”CSS3基本上句法.html”的文件,在里头演示CSS3句法和注解。

标识符如下表所示:

<!DOCTYPE html><htmllang=”en”><head><metacharset=”UTF-8″><metaname=”viewport”content=”width=device-width, initial-scale=1.0″><title>CSS3基本上句法</title><style>h2,h3 {color:red;/* 背景颜色 */background-color: snow; }p {color: gold;/* 背景颜色 */background-color: darkgrey; }li {color: green;/* 背景颜色 */background-color: lightblue; }</style></head><body><h2>你能迷茫,请不要虚度。</h2><h2>有道无术,术尚可求,有术无道,止于术。</h2><h2>每个人心里都有一团火,路过的人只能看到烟。</h2><p>不要被岁月静好麻痹,有实力的人才能好,一无所有的人只能静。</p><p>有些人很奇怪,不爱你,也不放过你。有些人更奇怪,爱你,还放过你。</p><p>如果不是生活所困,谁愿意一身才华呢?</p><h3>资本只会投圈内人,不会投圈外人</h3><ul><li>A轮投资投产品</li><li>B轮投资投数据</li><li>C轮投资投收入</li><li>D轮投资投利润</li></ul></body></html>

我这里CSS标识符用了内嵌式写法。

background-color是背景颜色的意思。

每三个选择器的最后两条式样,前面能写分号,也能不写分号,其他的必须要写分号。

在浏览器中效果如下表所示:

31 CSS3的基本语法和注释
举报/反馈

相关文章

发表评论
暂无评论
官方客服团队

为您解决烦忧 - 24小时在线 专业服务