Html 为什么我的 CSS 没有成功设置 div 边框的颜色？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/7094608/
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
why my CSS did not set the color of div border successfully?
提问by Leem
I have a divin my html page which holds 3 radio buttons:
div我的 html 页面中有一个包含 3 个单选按钮的页面：
<html>
<head>
<link href="CSS/mystyle.css" rel="stylesheet" type="text/css" media="screen" />
</head>
<body>
<div id="outside">
<div id="inside">
<input type="radio"> apple
<input type="radio"> orange
<input type="radio"> banana
</div>
<div id="others"></div>
</div>
</body>
</html>
My CSS is located under CSS directory,
我的 CSS 位于 CSS 目录下，
CSS/mystyle.css:
CSS/mystyle.css：
#inside{
font-size:12px;
border-color:#ff3366;
width: 300px;
height: 50px;
}
The width, heightand font-sizeare set successfully, but the border-color:#ff3366;does not shows, why? Why I am failed to set the border color for the div ?
的width，height并且font-size被成功设置，但border-color:#ff3366;不显示了，为什么？为什么我没有为 div 设置边框颜色？
-------------------- MORE ---------------------
- - - - - - - - - - 更多的 - - - - - - - - - - -
By the way, how to locate my inner div (with id="inside") to the right hand side of the outside div, with about 100px margin to the right most border of outside div?
顺便说一句，如何将我的内部 div（带有 id="inside"）定位到外部 div 的右侧，并且在外部 div 的最右侧边缘有大约 100px 的边距？
回答by tw16
You need to set a border-style. Live example: http://jsfiddle.net/tw16/qRMuQ/
您需要设置一个border-style. 现场示例：http: //jsfiddle.net/tw16/qRMuQ/
border-color:#ff3366;
border-width: 1px; /* this allows you to adjust the thickness */
border-style: solid;
This can also be written in the shorthand:
这也可以写成简写：
border: 1px solid #ff3366;
UPDATE: To move #insideto the right you need to float:rightthen add a margin-right: 100px. Live example: http://jsfiddle.net/tw16/qRMuQ/
更新：要#inside向右移动，您需要float:right添加一个margin-right: 100px. 现场示例：http: //jsfiddle.net/tw16/qRMuQ/
#outside{
overflow:auto;
}
#inside{
font-size:12px;
border-color:#ff3366;
border-width: 1px;
border-style: solid;
width: 300px;
height: 50px;
float: right; /* this will move it to the right */
margin-right: 100px; /* this applies the 100px margin from the right */
}
回答by Blindy
The color was set fine, you just never actually addeda border. Try using this:
颜色设置得很好，你只是从未真正添加过边框。尝试使用这个：
#inside{
font-size:12px;
border-color:#ff3366;
border-style: solid;
border-width: 3px;
width: 300px;
height: 50px;
}
As to your updated question, make it float:rightand margin-right:100px. The only caveat is, you need to add an extra div after #otherwith just clear:bothto clear the floated div.
至于你更新的问题，让它float:right和margin-right:100px。唯一需要注意的是，您需要在#otherwith之后添加一个额外的 divclear:both来清除浮动的 div。
