如何使用HTML制作一条垂直线?


当前回答

我需要一条内联的垂直线,所以我把一个按钮变成了一条直线。

<button type="button" class="v_line">l</button>

.v_line {
         width: 0px;
         padding: .5em .5px;
         background-color: black;
         margin: 0px; 4px;
        }

其他回答

你可以使用hr(水平线)标签,然后用下面的css旋转90度

hr {   
    transform:rotate(90deg);
    -o-transform:rotate(90deg);
    -moz-transform:rotate(90deg);
    -webkit-transform:rotate(90deg);
}

http://jsfiddle.net/haykaghabekyan/0c969bm6/1/

在你想要应用竖行的Previous元素中,你可以设置CSS…

border-right-width: thin;
border-right-color: black;
border-right-style: solid;

对于内联样式,我使用了以下代码:

<div style="border-left:1px black solid; position:absolute; left:50%; height:300px;" />

这样就把它直接放在了中心。

没有与<hr>元素等值的垂直元素。然而,你可能想尝试的一种方法是在你要分离的东西的左边或右边使用一个简单的边界:

# your_col { Border-left: 1px纯黑色; } < div id = " your_col " > 你的内容在这里 < / div >

在标记周围放置<div>,然后使用CSS来设置它的样式:

.verticalLine { Border-left:厚实实心#ff0000; } < div class = "垂线”> 其他内容 < / div >