border边框练习

原创 2018-10-19 16:12:45 166
摘要:边框练习<!DOCTYPE html><html><head><meta charset="UTF-8"><title>Document</title><style>    div{     margin-top: 10px;  &nb
边框练习

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>Document</title>

<style>

    div{

     margin-top: 10px;

    }

        .box1{

         width: 200px;

         height: 200px;

         background-color: blue;

         border-radius: 50%;

         border: 3px solid black;

        }


        .box2{

         width: 200px;

         height: 200px;

         background: #BFBFBF url() 0 0 no-repeat;

         border-bottom: 2px dashed #000;

         border-top: 5px dotted  #3FD784;

         border-right: 10px double #FFFF00;

         border-left: 2px solid #ED1C24;

        }


        .box3{

         width: 100px;

         height: 100px;

         background: yellow;

         border-radius: 20px;

        }

</style>

</head>

<body>

<div></div>

<div></div>

<div></div>

</body>

</html>



发布手记

热门词条