css - 行或 html 元素中的 css/js/php 圆角

Question

应该有一种方法可以使用几行代码在表格行或元素中创建圆角。（这似乎比使用图像的其他更复杂的方式更可取。）

#example1 {
-moz-border-radius: 15px;
border-radius: 15px;
}

但是，作为一个 css/js 菜鸟，我不知道该怎么办。我可以将它放在元素内的样式标签中以进行舍入吗？是否将其放入 .css 文件中？我不希望这适用于所有行或表格单元格，只适用于一个。非常感谢正确的语法/用法。

score 1 · Accepted Answer

您可以在容器的样式属性中执行此操作：

<div style="-moz-border-radius: 15px; border-radius: 15px;">....</div>

或在您的 css 文件中：

.class1 { 
    -moz-border-radius: 15px; 
    border-radius: 15px; 
}  

//and add it to your container:
<div class="class1">....</div>

score 1 · Accepted Answer

据我所知，这不是 IE 8 或 bellow 友好的，尽管在 Chrome、Safari 和 Firefox（等）中它可以工作。

如果您只打算使用一次，请将其直接放入您的容器中。

<div style="-moz-border-radius: 15px; border-radius: 15px;"> Content here </div>

如果您要在页面上多次使用它，我建议将它放在页面顶部的头部（或样式表文件中）：

<style type="text/css">
    .roundedcorners { 
        -moz-border-radius: 15px; 
        border-radius: 15px; 
    }  
</style>

并在容器中放入

<div class="roundedcorners"> Content here </div>

2 回答 2