CSS学习笔记第20天--圆角图片

网站建设 · 2020-11-08
3.2.5 圆角图片hz6IT米工网
CSS3中新增加了border-radius属性,即图片圆角属性hz6IT米工网
例: .pic{border-radius:10px;}
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style type="text/css">
    body{
        margin:20px;
        padding:20px;
    }
    .a{
        width:150px;
        height:150px;
        border:1px solid gray;
        border-radius:10px;
    }
    </style>
</head>
<body>
<img src="images/1.jpg" alt="" class="a">
<img src="images/2.jpg" alt="" class="a">
<img src="images/3.jpg" alt="" class="a">
<img src="images/4.jpg" alt="" class="a">
</body>
</html>
      hz6IT米工网