首页 > 其他分享 >CSS 根据 type 类型显示不同的样式

CSS 根据 type 类型显示不同的样式

时间:2023-02-10 13:45:28浏览次数:40  
标签:span 样式 color background type CSS

<span type="par">【背景切换】</span>

span[type] {
  font-size: 13px;
}

span[type='par'] {
  color: #e05c69;
  background-color: #e1f1fa;
  .modify;
}

span[type='word'] {
  color: #666;
  background-color: #ccc;
}

标签:span,样式,color,background,type,CSS
From: https://www.cnblogs.com/DL-CODER/p/17108588.html

相关文章

  • css节流
    众所周知,函数节流(throttle)是JS中一个非常常见的优化手段,可以有效避免函数过于频繁的执行。 举个例子:一个保存按钮,为了避免重复提交或者服务器考虑,往往需要对点击行为......
  • JQuery对象和JS对象区别与转换以及JQuery事件绑定,入口函数,样式控制
    <!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><title>JQuery对象和js对象的转换</title><scriptsrc="js/jquery-3.3.1.min.js"></scri......
  • Flutter使用SliverAppBar开发更多样式AppBar
    代码参考于【无聊的编码】FlutterSliver全家桶初体验,一起炫酷一下,有优化只是用官方的SliverAppBar只能做到如下样式:但是我们想要的结果是下面这样的:为此,我封装了一......
  • 防止滚动 css 样式 overscroll-behavior
    overscroll-behaviorhttps://developer.mozilla.org/zh-CN/docs/Web/CSS/overscroll-behavior  别人的问题人家的点击空白还能缩小,我不知道怎么做的.试了全局遮罩,......
  • 页面导入样式时,使用link和@import有什么区别?
    1.从属关系区别@import是CSS提供的语法规则,只有导入样式表的作用;link是HTML提供的标签,不仅可以加载CSS文件,还可以定义RSS、rel连接属性等。2.加载顺序区别加载页......
  • [Typescript] Using type predicates
     import{expect,it}from"vitest";import{Equal,Expect}from"../helpers/type-utils";exportconstvalues=["a","b",undefined,"c",undefined];c......
  • threejs_单例模式_项目结构_tansform控制器_css2dlabel_事件派发EventDispacher_事件
    /Users/song/Code/threejs_learn_vanilla_class_singleton/threejs_learn_vanilla_ts_class_singleton/src/main.tsimport"./style.css";importBasefrom"./threejs/......
  • css样式居中
    水平居中1.块级元素margin:0auto;.container{height:100px;width:300px;border:1pxsolidred;}.content{width:60px;......
  • 学习css的第三天~
    高级选择器:1、后代选择器元素E空格元素F(改变F元素,且F元素是被E元素包含在内的) 2、子选择器元素E>元素F(改变E元素,且F元素是匹配E元素的子元素) 3、相邻兄弟选......
  • typeof和instanceof的区别
    1.typeof用于判断数据类型,返回值有number、string、boolean、function、undefined、object六个。在这里我们可以看到typeof判断null、array、object以及函数的实例(new+......