css中 和点分别代表啥

admin 轻心小站 关注 LV.19 运营
发表于前端技术学习版块 css,教程

CSS是网页设计中不可或缺的一部分,在 CSS 中,我们经常会用到“.”和“#”这两个符号,它们代表的含义有何不同呢? .class { /* 这里是 CSS 样式 */ } #id { /* 这里是

CSS是网页设计中不可或缺的一部分,在 CSS 中,我们经常会用到“.”和“#”这两个符号,它们代表的含义有何不同呢?

 .class {
        /* 这里是 CSS 样式 */
    }

    #id {
        /* 这里是 CSS 样式 */
    } 

首先让我们来看看点(“.”)代表的含义。点符号表示类(class),我们可以使用类来为一组 HTML 元素设置相同的样式。例如,我们可以为所有的段落设置相同的字体大小:

 .paragraph {
        font-size: 16px;
    } 

上述 CSS 代码中,“.paragraph”表示一个类名,表示所有使用这个类的 HTML 元素都会具有这个样式。我们只需要在 HTML 中,引用这个类名,并将其赋值给“class”属性即可。

 <p class="paragraph">这里是文字内容</p> 

接下来,让我们来看看“#”号代表的含义。#号表示 ID,每一个 HTML 元素都可以有一个唯一的 ID 值。ID 可以让我们有针对性地为某个特定的元素设置样式,而不影响其他元素。例如:

 #logo {
        width: 100px;
        height: 100px;
    } 

上述 CSS 代码中,“#logo”表示一个 ID 名称,表示只有具有这个 ID 的 HTML 元素(例如一个 logo 图片)才会应用这个样式。我们可以在 HTML 中,为这个元素设置与 CSS 中相对应的 ID 值:

 <img src="logo.png" alt="公司logo" id="logo"> 

总结来说,“.”表示类,是一组元素的集合,我们可以为这组元素设置相同的样式;“#”号表示 ID,是唯一的,用于某个具体的元素,我们可以为该元素设置具体的样式。

文章说明:

本文原创发布于探乎站长论坛,未经许可,禁止转载。

题图来自Unsplash,基于CC0协议

该文观点仅代表作者本人,探乎站长论坛平台仅提供信息存储空间服务。

评论列表 评论
发布评论

评论: css中 和点分别代表啥

粉丝

0

关注

0

收藏

0

已有0次打赏