博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
:before
阅读量:6161 次
发布时间:2019-06-21

本文共 579 字,大约阅读时间需要 1 分钟。

hot3.png

想要出现如图效果中间的线距离两边32px,并且只有中间一条,第二个li没有,利用:before实现

102631_uqET_2757104.jpg

.dropDownMenu {  position: relative;  padding: 0 32px;  .font(96px, @font28, left, #404040, 1);  &:before{    content: ""; position: absolute;    left: 32px;    right: 32px;    top: 96px;    border-bottom: 1px solid @border_color;  }  &:last-child:before {    content: "";    position: absolute;  }}

注意:

  1. 写before时content属性一定要有,如果是放图片或只是画出一条线那么双引号中间什么也不要写,连空格都不写。
  2. 盒子的定位方式为relative,before的定位方式为absolute
  3. 设置最后一个元素清除before用&:last-child找到最后一个,在设置他的before即可。

转载于:https://my.oschina.net/yjjjjjj/blog/703195

你可能感兴趣的文章
Win7+Ubuntu11
查看>>
请问华为三层交换机里面的那个从IP是个什么意思? -
查看>>
kFeedback开源啦
查看>>
大数据传输,文件传输的专业解决方案!
查看>>
阿里云专家穆轩的《杭州九年程序员之“修炼”手册》
查看>>
JQuery:deferred对象的方法
查看>>
eyoucms问答 百度权重是什么
查看>>
win10中遇到qq视频时摄像头打不开没反应的解决方法
查看>>
介绍自己的一个Android插桩热修复框架项目QuickPatch
查看>>
关于textarea的ie9的maxlength不起作用的问题,请参考如下URL解决。
查看>>
Solr Facet 查询
查看>>
C++类的继承一
查看>>
数据库分库分表(sharding)系列(五) 一种支持自由规划无须数据迁移和修改路由代码的Sharding扩容方案...
查看>>
巧用VMware Workstation的clone来制作虚拟机模板
查看>>
Spring-Mybatis MapperScannerConfigurer 取不到PropertyPlaceholderConfigurer里的值
查看>>
HP DL380G4服务器前面板指示灯的含义
查看>>
数据结构_树结构
查看>>
常用URL地址
查看>>
每天一个linux命令(19):find 命令概览
查看>>
MySQL kill操作
查看>>