1

这可能是一个非常初学者的问题，但这就是我在 CSS 中的问题。我有这个：

<div id="box">
        SAMPLE TEXT TO DISPLAY IN BOX!
</div>

此框的 css 位于外部工作表中（正确链接到 html 页面）：

#box {
border-radius: 28px; 
-moz-border-radius: 28px; 
-webkit-border-radius: 28px; 
border: 5px solid #3B5998;
}

当我尝试在我的页面中使用代码时，它不起作用！知道为什么吗？如果问题太简单，再次抱歉:)

编辑：我在另一个中心的 div 中使用的框。这是它的使用方式：

<div id="center">
    <div id="box">
        Hdadjlsd
    </div>
</div>

这是中心的CSS：

#center { 
margin-right:200px;
background-color:white; 
min-height:700px; /* for modern browsers */
height:auto !important; /* for modern browsers */
height:700px; /* for IE5.x and IE6 */
}

在这个标签之外它可以工作。

编辑：屏幕截图显示了 chrome 突出显示的问题。检查元素时，它显示了红色框现在的位置在此处输入图像描述

4

4 回答 4

2

将此代码复制粘贴到您的 html 中，检查其是否正常工作。我确定如果您使用 chrome 会这样做 :)，如果它有效，则将 css 输入到您的 html 中并运行它。

 <html>
  <head>
  <style type="text/css"> 
   div
 {
 border:2px solid #a1a1a1;
 padding:10px 40px; 
 background:#dddddd;
 width:300px;
 border-radius:25px;
 }
 </style>
 </head>
 <body>
 <div>The border-radius property allows you to add rounded corners to elements.</div> 
 </body>
  </html>
于 2012-09-18T06:47:27.453 回答
0

您是否尝试过在页面中包含 css？一般趋势是在页面内部使用此类 CSS，而不是作为外部链接。

于 2012-09-18T06:43:19.777 回答
0

您可以使用这些代码；

-moz-box-shadow: 2px 2px 7px #000000;
-webkit-box-shadow: 2px 2px 7px #000000;
 box-shadow: 2px 2px 7px #000000;
-moz-border-radius-topleft: 28px;
-moz-border-radius-topright:28px;
-moz-border-radius-bottomleft:28px;
-moz-border-radius-bottomright:28px;
-webkit-border-top-left-radius:28px;
-webkit-border-top-right-radius:28px;
-webkit-border-bottom-left-radius:28px;
-webkit-border-bottom-right-radius:28px;
border-top-left-radius:28px;
border-top-right-radius:28px;
border-bottom-left-radius:28px;
border-bottom-right-radius:28px;

您可以在此处查看您的 CSS 代码

于 2012-09-18T06:52:35.547 回答
0

...................... 给border-radius 你的#centerid div

像这样

    #center { 
      border-radius:28px 28px 0 0;
-webkit-border-radius:28px 28px 0 0;
-moz-border-radius:28px 28px 0 0;
    }

演示

于 2012-09-18T06:55:25.670 回答