CSS边框属性

来源:互联网 发布:手机投资黄金软件 编辑:程序博客网 时间:2024/06/04 18:13

CSS 边框的属性有style(样式)、color(颜色)、width(宽度)、height(高度)等。

举个例子,如果我们想要让一个HTML元素的边框颜色为红色、边框宽度为5像素(px)、边框样式为固体(solid),代码如下:

<style>
  .thin-red-border {
    border-color: red;
    border-width: 5px;
    border-style: solid;
  }
</style>

任务:创建一个叫thick-green-border的class,让它的边框宽度为10像素、边框样式为solid(固体)、边框颜色为绿色(green),然后把这个class应用到你的猫咪照片上。

提示:你可以应用多个class到一个元素,只需要在多个class之间用空格分开即可。例如:

<img class="class1 class2">

猫咪图片的边框现在是尖尖的,不够可爱,我们可以通过CSS的一个叫border-radius(边框半径)的属性来让它的边框变成圆的。

你同样可以使用像素来指定border-radius的属性值,现在让你的猫咪图片的边框半径为10px吧。

注意:这个任务有多种解决方案。你可以添加border-radius到.thick-green-border类选择器,也可以添加到.smaller-image类选择器.