当前位置： 移动技术网 > IT编程>网页制作>CSS > 使用stylus选择元素列表的中后n个并为他们单独设定样式案例

使用stylus选择元素列表的中后n个并为他们单独设定样式案例

2018年10月07日  | 移动技术网IT编程  | 我要评论

儋州汽车站,messbon,曲周县

使用stylus选择元素列表的中后n个并为他们单独设定样式

在开发这种类似表格的页面时我遇到一个需求，那就是表格中每一个元素要有边框，但是最底下那一排元素不需要底部边框，但是表格每行个数不定，可能是3个可能是4个，我便用stylus写了一个函数。

\

具体实现是这样的：

对于每一个 li 即城市名，它有一个右边框，一个下边框。随意这会让最右边多一排右边框，但是用了border.css（解决1像素边框问题的css文件）后右边那个是看不出来的，我们就主要解决下边框问题。

stylus函数如下：

noboderbottom(num)
  for i in 1..num
    &:nth-last-of-type({i})
      border-bottom 0

编译出来的css就成了这样，很好用！

\

--------------------------------------分割线----------------------------------

我找到一个技巧，设置子元素的magin-bottom： -1px，直接在父元素上overflow: hidden就好。。。

您可能感兴趣的文章:

如对本文有疑问，请在下面进行留言讨论，广大热心网友会与你互动！！ 点击进行留言回复

相关文章:

验证码：
最近更新的文章
大家感兴趣的文章
移动技术网