鍍金池/ 問答/HTML/ CSS如何制作這種線條？

CSS如何制作這種線條？

clipboard.png

橫著的線我可以用hr來實(shí)現(xiàn)，但是如何實(shí)現(xiàn)豎著的這個(gè)線條呢？

回答
編輯回答
萢萢糖
  1. 每個(gè)盒子有下和右邊框
  2. media-query每行最后一個(gè)去掉右邊框
2017年2月13日 17:57
編輯回答
傲嬌范

1、背景漸變可以制作

li{
    background:linear-gradient(to bottom,#dd2926,#a82724) no-repeat right / 1px 20px;
}

2、border-right也可以
3、加一個(gè)元素進(jìn)去也可以 例

<li></li>
<i></i>
<li></li>

<style>
i{
    display:inline-block;
    width:1px;
    height:30px;
    background:#eee;
}
</style>
2017年2月4日 22:58
編輯回答
悶油瓶

border
或者當(dāng)前標(biāo)簽比如li
li {

border-right: 1px solid #000;

}

看你怎么應(yīng)用

2018年1月5日 19:01
編輯回答
涼薄

table + border-collapse:collapse;

2017年11月20日 07:05
編輯回答
耍太極

這個(gè)是1px的細(xì)線邊框，border-collspace : collspace.

2017年2月16日 02:37