即指定多个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. React学习笔记-03 state

    每一个组件都有状态,比如一个开关,开 和 关,都是一种state.那么react是怎么管理它的state的? React 把用户界面当做状态机,可以轻松的让用户界面和数据保持一致.用户只需要更新组件的 ...

  2. Output\TEST.sct(7): error: L6236E: No section matches selector - no section to be FIRST/LAST.

    点击错误信息,跳转到了一个.sct文件:*.o (RESET, +First) 按照如下操作,也不能解决问题.对比别的工程,也没找出问题. "操作是: Options for Target ...

  3. LightOJ 1095 Arrange the Numbers-容斥

    给出n,m,k,求1~n中前m个正好有k个在原来位置的种数(i在第i个位置) 做法:容斥,先选出k个放到原来位置,然后剩下m-k个不能放到原来位置的,用0个放到原来位置的,有C(m-k,0)*(n-k ...

  4. Git忽略对特定文件的跟踪和提交

    1.有未提交过的文件,并且此文件项目组中的其他人员也需要忽略,可将此文件的完整路径写入项目文件夹下的.gitignore文件. 2.有未提交过的文件,此这些文件与项目组中的其他人员无关,毋须写入.gi ...

  5. 调试技术(/proc、/sys、/dev、strace)

    一.在/proc中实现文件 当某个进程读取我们的/proc文件时,内核会分配一个内存页,即PAGE_SIZE字节的内存块.驱动程序可以将数据通过这个内存页返回到用户空间. 第一种方法,不采用seq_f ...

  6. 【转】Matrix67:十个利用矩阵乘法解决的经典题目

    好像目前还没有这方面题目的总结.这几天连续看到四个问这类题目的人,今天在这里简单写一下.这里我们不介绍其它有关矩阵的知识,只介绍矩阵乘法和相关性质.    不要以为数学中的矩阵也是黑色屏幕上不断变化的 ...

  7. hdu1025

    #include<stdio.h>const int MAXN=500010;int a[MAXN],b[MAXN]; //用二分查找的方法找到一个位置,使得num>b[i-1] 并 ...

  8. 使用bootstrap建立响应式网页——通栏轮播图(carousel)

    1.bootstrap提供了js插件——轮播图 我们还是照旧,直接拿过来用,需要改的地方再说. 2.修改 小屏幕看小图,大屏图看大图:这个可以利用自定义属性(data-XXX)data-img-lg( ...

  9. Python学习笔记_Chapter 6定制数据对象

    1. 有用的BIF a. 判断字符串中是否包含子字符串 if s_a in s_b: b. pop() 描述:从指定的列表位置删除并返回一个数据项. (sarah_name,sarah_dob)=l_ ...

  10. shell脚本学习(五)

    1.统计文件的行数.单词数.字符数 1)行数: wc -l file cat file | wc -l 2)单词数 wc -w file cat file | wc -w 3)统计字符数 wc -c ...