高防服务器

css class怎么同时设置多个值


css class怎么同时设置多个值

发布时间:2022-03-05 17:20:46 来源:高防服务器网 阅读:67 作者:iii 栏目:web开发

本篇内容介绍了“css class怎么同时设置多个值”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!

class同时设置多个值是甚么意义?

<div class=”aaa bbb ccc”>class运用多个值</div>

每个值空格离隔。

确凿代表class引入3个CSS抉择器,即:

.aaa{}  .bbb{}  .ccc{}

为甚么会多么?
实际上有时一个款式多处用,有的共用,有的又有分辨,这个时候将一起用的新建一个CSS选择器,一致的再新建一个CSS决定器,何等便于重(cong)用糜费CSS代码。

举例一个CLASS多值简单熟悉。

要是有3个DIV盒子,均设置装备摆设了一个近似边框名目,但宽度差异,这里即可以或许使用何等一个div内应用一个class引入多个抉择器命名。

完整实例代码:

<!DOCTYPE html>  <html>  <head>  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />  <title>class多个值实例</title>  <style>  .bk{ border:1px solid #F00}  .w100{ width:100px}  .w200{ width:200px}  .w300{ width:300px}  </style>  </head>  <body>  <div class="bk w100">宽度100,带边框</div>  <div class="bk w200">宽度200,带边框</div>  <div class="bk w300">宽度300,带边框</div>  </body>  </html>

这里三个DIV均设置近似边框花色,宽度不合,应用一个class运用两个CSS决意器。

一个class=多值,也等于一个class调用引入多个css名目。

“css class怎么同时设置多个值”的内容就介绍到这里了,感谢大家的阅读。如果想了解更多行业相关的知识可以关注高防服务器网网站,小编将为大家输出更多高质量的实用文章!

[微信提示:高防服务器能助您降低 IT 成本,提升运维效率,使您更专注于核心业务创新。

[图文来源于网络,不代表本站立场,如有侵权,请联系高防服务器网删除]
[