即指定多个class，这是bootstrap常干的事，比如 <div class="alert alert-info">

请问，这两个class之间的关系是什么，二者的优先级是怎样的？

我自己定义了一个class ，加在后面，但没起作用，当然，如果写到style里去是可以的。

你说的没错，就是指定多个class的意思，在HTML的层面上说的话，这样指定的class是同级的。同级的class需要看CSS文件的先后次序，后加载的css会覆盖前面加载的css。写到style的话因为是最后解析的所以是最高的一个优先级。

前面的答案，都是合理的。但依我看，这么干侧重在于 CSS 的模块化设计。.alert 是基础公共层，.alert-info 是个表现扩展层。

像 @Aivier 所说的，它还有可能有 alert-warning，alert-success 等等，假如我们每个分开写的话，小页面没什么问题，但是它在一个大项目里，就显得很笨拙，增加了开发的时间成本。所以，人们为了提高代码的重用性，把类似的结构或功能等等的部件，划为一个模块。然后把它们的共性提炼出来，也就是这段代码前的 .alert，再分开写它们具体的表现样式，即.alert-info。

多个class你可以理解成一对多的意思，说的是这一块有多个class样式。 css的优先级考虑的地方还算比较多，你这里使用style毫无疑问是优先级最高的，任何情况想style的优先级都是最高的。其次是ID和各种选择器和继承，其实单独一个class的优先级很低的。

<div class="alert alert-info">

同时指定了多个CSS样式，这里面的alert-info还可以换成alert-warning，alert-success等，这样分开多个class可以减少重复的代码，alert中的样式只写一次即可，而不用alert-warning，alert-info中都重复一遍

你自己写的样式可以在分号前增加 !important 来强制应用样式

html元素中class属性值多个空格分格是什么意思？的更多相关文章

  1. html元素中class属性值多个空格分格

    问题: 比如 <div class="alert alert-info"> 回答: 同时指定了多个CSS样式,这里面的alert-info还可以换成alert-warn ...

  2. javascript_获取iframe框架中元素节点的属性值

    1. DOM:文档对象模型 [window 对象] 它是一个顶层对象,而不是另一个对象的属性即浏览器的窗口. [document 对象] 该对象是window和frames对象的一个属性,是显示于窗口 ...

  3. <s:property="a" value=""/>取的<s:debug></s:debug>中的value stack中的属性值

    <s:property="a"  value=""/>取的<s:debug></s:debug>中的value stack中 ...

  4. LinearLayout的gravity属性以及其子元素的layout_gravity何时有效；RelativeLayout如何调整其子元素位置只能用子元素中的属性来控制，用RelativeLayout中的gravity无法控制！！！

    LinearLayout的gravity属性以及其子元素的layout_gravity何时有效:RelativeLayout如何调整其子元素位置只能用子元素中的属性来控制,用RelativeLayou ...

  5. 将source类中的属性值赋给target类中对应的属性

    /** * 对象的属性值拷贝 * <p> * 将source对象中的属性值赋值到target对象中的属性,属性名一样,类型一样 * <p> * example: * <p ...

  6. Spring中使用@Value读取porperties文件中的属性值方法总结及注意事项

    本文为博主原创,转载请注明出处. 此前曾总结过使用工具类读取properties文件中的属性值,有兴趣的可以看一下. 如何快速获取properties中的配置属性值:https://www.cnblo ...

  7. 【Python】获取翻页之后的各页面中的属性值。

    如何获取翻页之后的页面中的html标签中的属性值? # coding=utf-8 from selenium import webdriver if __name__=="__main__& ...

  8. ajax取到数据后如何拿到data.data中的属性值

    今天遇到的ajax取到数据后如何拿到data.data中的属性值的问题 比如拿到了数据 我要取出data中的name 题外话:当然取名最好别取什么奇怪的xiaobi

  9. Implement Property Value Validation in the Application Model 在应用程序模型中实现属性值验证

    In this lesson, you will learn how to check whether or not a property value satisfies a particular r ...

随机推荐

  1. 语言总结—C/C++

    参考<程序员面试宝典> 1. 基本概念 1.1 赋值语句 例1. 按位与操作,例如:a=3,b=3,a&b值等于 0011 & 0011 结果还是0011,那么值还是3: ...

  2. winform上传文件

    //上传图片 文件 public int addUpPic( String strProCode,String strFileName,String strUpType) { //strFileNam ...

  3. Linux格式化字符串

    > 常用 > 详细 给定的格式FORMAT 控制着输出,解释序列如下: %% 一个文字的 % %a 当前locale 的星期名缩写(例如: 日,代表星期日) %A 当前locale 的星期 ...

  4. hdu1016

    #include <stdio.h>#include <string.h> int prime[38]={0,0,1,1,0,1,0,1,0,0,0,1,0,1,0,0,0,1 ...

  5. js中checkbox反选

    <!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content ...

  6. 第七十一，CSS颜色与度量单位

    CSS颜色与度量单位 学习要点: 1.颜色表方案 2.度量单位 本章主要探讨HTML5中CSS颜色和度量单位等问题,包括颜色的选取方式.相对长度和绝对长度等.   一．颜色表方案 1 颜色的表现形式主 ...

  7. mysql 数据列按照逗号转成行

    前言: 由于很多业务表因为历史原因或者性能原因,都使用了违反第一范式的设计模式.即同一个列中存储了多个属性值(具体结构见下表). 这种模式下,应用常常需要将这个列依据分隔符进行分割,并得到列转行的结果 ...

  8. qt rcc 使用

    做项目的时候, 最初把图片放到 qrc里面, 使用编译生成的qrc_cpp. 但是编译超慢, 还经常提示"编译器空间不足". 网上很多人说是 中文路径的问题. 可是总是感觉编译器空 ...

  9. jQuery插件实现左右无缝轮播

    前段时间学习jQuery的时候,在网上找了个SuperSlide插件,做轮播图demo,感觉对于新人而言,还是挺容易上手的,代码量也少. 直接贴代码吧. 1.HTML <!DOCTYPE htm ...

  10. LINUX nfs服务

    1.什么是NFS(Network FileSystem)  NFS 就是 Network FileSystem 的缩写,最早之前是由 Sun 所发展出来的.他最大的功能就是可以透过网络,让不同的机器. ...