1.伪类::before&::after 我们知道可以给 HTML标签添加伪元素,其中::befare、::after能够应用几乎所有的 CSS 属性,也就是说可以通过添加伪元素让一个HTML标签实现3个标签的样式效果,这样可以减少在复杂的 CSS icon 中的标签数量,让HTML结构更简洁。 div .pseudo{ position:relative; width:150px; height:70px;...
如果是在标签内加icon  如果是使用class 如果是放在伪元素中使用: 需要将类名iconfont中的样式拿过来: .el-form-item__error::before { content: '\e70d qt 原创 蓝色海岛 2021-07-13 16:22:26 692阅读 iconfont 字体图标错乱 iconfont 字体图标错乱...
/* 只选择 type =text 文本框的input 选取出来 */input[type=text]{color:pink;}/* 选择首先是div 然后 具有class属性 并且属性值 必须是 icon开头的这些元素 */div[class^=icon]{color:red;}/* 选择首先是section 然后 具有class属性 并且属性值 必须是 data结尾的这些元素 */section[class$=data]{color...
CSS语义-icont+text /*icont+text*//*电子券 预付卡*/.bg-image{padding:5px;padding-left:15px;background-size:12px;margin-left:5px; }.ticket-image{background:url(../img/merchant/icon_q.png) no-repeat left center; }.card-image{background:url(../img/merchant/icon_k.png) no-repeat ...
icon 为元素指定图标 3 nav-down 指定用户按向下键时向下导航的位置 3 nav-index 指定导航(tab)顺序。 3 nav-left 指定用户按向左键时向左导航的位置 3 nav-right 指定用户按向右键时向右导航的位置 3 nav-up 指定用户按向上键时向上导航的位置a 3 outline-offset 设置轮廓框架在 border 边缘外的偏移 3 ...
.clearFix::after{ clear: both; content: ""; display: block; height: 0; overflow: hidden; } 包含cleafFix 这个类的元素,其内部的浮动可以被清除。 4.2 string(字符串) 在电话号码前面添加一个电话的icon图标。代码如下: HTML部分 13900001390
.icon-item:hover .icon:after{-webkit-box-shadow:0 0 0 2px #f3f3f3;box-shadow:0 0 0 2px #f3f3f3}.icon{position:relative;font-size:40px;cursor:pointer;margin:40px 0 0;width:80px;height:80px;line-height:80px;border-radius:50%;z-index:2;color:#fff;display:inline-block;color:rgba...
icon 为元素指定图标 3 nav-down 指定用户按向下键时向下导航的位置 3 nav-index 指定导航(tab)顺序。 3 nav-left 指定用户按向左键时向左导航的位置 3 nav-right 指定用户按向右键时向左导航的位置 3 nav-up 指定用户按向上键时向上导航的位置a 3 outline-offset 设置轮廓框架在 border 边缘外的偏移 3 ...
CSS的content属性,大家应该都不陌生,很多时候我们都使用过,一般情况下你看到最多的用法无外乎这样两种:一种用于清除浮动,一种用于我们经常使用的字体图标。 代码语言:javascript 复制 .clear:after{content:"";display:block;clear:both;}.icon:before{content:"\e778";} ...
但是,通过给这个元素加上resize: both以及overflow: scroll,此时,这个元素的大小就通过元素右下角的 ICON 进行拖动改变。 简单修改下我们的 CSS 代码: 代码语言:javascript 复制 .g-resize{width:100px;height:100px;border:1px solid deeppink;resize:both;overflow:scroll;} ...