css两个类名没空格

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

在CSS中,类名是一种非常重要的选择器,它能够帮助我们在HTML文档中找到我们需要样式化的元素。在CSS中,类名一般以一个点(.)开头,并且可以命名为任何我们想要的名称。在编写CSS样式表时,我们经常

在CSS中,类名是一种非常重要的选择器,它能够帮助我们在HTML文档中找到我们需要样式化的元素。在CSS中,类名一般以一个点(.)开头,并且可以命名为任何我们想要的名称。

在编写CSS样式表时,我们经常会为一个元素添加多个类名来同时应用不同的样式规则。在这种情况下,我们可以把多个类名写在一起,而不需要添加空格区分它们。

 .btn-primary {
        background-color: blue;
        color: white;
    }

    .btn-small {
        font-size: 12px;
    }

    .btn-primary.btn-small {
        padding: 5px;
    } 

上面的代码演示了如何同时为一个按钮元素应用两个不同的类名,而不需要在类名之间添加空格。这里我们定义了一个btn-primary类,用于指定按钮的蓝色背景和白色文本颜色。我们还定义了一个btn-small类,用于指定按钮的字号大小为12像素。

然后,我们添加了一个新类名.btn-primary.btn-small,这表明我们要同时应用btn-primary和btn-small两个类名,来实现对按钮的样式化。在这个特定的例子中,我们给这个按钮添加了内边距为5像素的样式。

需要注意的是,如果我们在类名之间添加了空格,这将被解释为两个不同的选择器,而不是一个元素同时具有两个类名。因此,如果我们想同时应用多个类名时,请确保不要在类名之间添加空格。

文章说明:

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

题图来自Unsplash,基于CC0协议

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

评论列表 评论
发布评论

评论: css两个类名没空格

粉丝

0

关注

0

收藏

0

已有0次打赏