Html 在div中画一条线
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/32819543/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Draw a line in a div
提问by Laetis
I want to make a div that is a line. Here is my HTML:
我想做一个 div 是一条线。这是我的 HTML：
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<link href="clickable.css" type="text/css" rel="stylesheet" />
</head>
<body >
<div class="line"></div>
</body >
</html>
And here my CSS:
这里是我的 CSS：
<style type="text/css">
.line{
width: 112px;
height: 47px;
border-bottom: 1px solid black;
position: absolute;
}
</style>
Nothing is displaying, something is probably wrong in my CSS, but I can't see what.
什么都没有显示，我的 CSS 可能有问题，但我看不到什么。
回答by Mukul Kant
Its working for me
它为我工作
.line{
width: 112px;
height: 47px;
border-bottom: 1px solid black;
position: absolute;
}<div class="line"></div>回答by ProgLover
No need for css, you can just use the HR tag from HTML
不需要 css，你可以使用 HTML 中的 HR 标签
<hr />
回答by imGaurav
$('.line').click(function() {
$(this).toggleClass('red');
});.line {
border: 0;
background-color: #000;
height: 3px;
cursor: pointer;
}
.red {
background-color: red;
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<hr class="line"></hr>
<p>click the line</p>回答by CreativePS
If the div has some content inside, this will be the best practice to have a line over or under the div and maintaining the content spacing with the div
如果 div 里面有一些内容，这将是在 div 上方或下方有一条线并保持与 div 的内容间距的最佳做法
.div_line_bottom{
border-bottom: 1px solid #ff0000;
padding-bottom:20px;
}
.div_line_top{
border-top: 1px solid #ff0000;
padding-top:20px;
}
回答by Mohamad Reza Shahrestani
Answered this just to emphasize @rblarsencomment on question :
回答这个只是为了强调@rblarsen对问题的评论：
You don't need the styletags in the CSS-file
您不需要 CSS 文件中的样式标签
If you remove the styletag from your css file it will work.
如果您从 css 文件中删除样式标记，它将起作用。
