Làm cách nào để vẽ một đường thẳng đứng trong trang web?

Question

Đối với chiều ngang, nó là <hr>. nhưng đối với đường thẳng đứng thì sao?

Answer 1

Đó không phải là vấn đề liên quan đến thanh chống mà là HMTL/CSS khá đơn giản.

Tôi không phải là chuyên gia về HTML hoặc CSS, nhưng tôi đoán bạn có thể sử dụng div với đường viền ở bên trái hoặc bên phải.

Answer 2

<hr> không phải từ thanh chống. Nó chỉ là một thẻ HTML.

Vì vậy, hãy xem tại đây: http://www.microbion.co.uk/web/vertline.htm Liên kết này sẽ cung cấp cho bạn một số mẹo.

Answer 3

Không có dòng dọc nào trong html mà bạn có thể sử dụng nhưng bạn có thể giả mạo bằng cách định vị hoàn toàn div bên ngoài vùng chứa của mình với kiểu top:0; và bottom:0;.

Hãy thử điều này:

CSS

.vr { 
    width:10px; 
    background-color:#000; 
    position:absolute; 
    top:0; 
    bottom:0; 
    left:150px; 
} 

HTML

<div class="vr">&nbsp;</div> 

Demo

Answer 4

@Andres, bạn có thể đơn giản hóa của bạn một chút hơn ..
CSS

vr { 
    display: block; 
    width:10px; 
    background-color:#000; 
    position:absolute; 
    top:0; 
    bottom:0; 
    left:150px; 
} 

HTML

<vr /> 

Demo

Answer 5

Bạn có thể sử dụng <hr> cho một đường thẳng đứng là tốt.
Đặt width thành 1 và kích thước (chiều cao) miễn là bạn muốn.
tôi đã sử dụng 500 trong ví dụ của tôi (demo):

Với <hr width="1" size="500">

DEMO