一、光标类型
属性:cursor: ;
值:
| default | 默认值:小白箭头 |
| pointer | 小手 |
| move | 移动 |
| text | 文本 |
| not-allowed | 禁止 |
| help | 帮助 |
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
.box {
width: 200px;
height: 200px;
background-color: #ccc;
cursor: pointer;
}
</style>
</head>
<body>
<a href="#">超链接</a>
<div class="box"></div>
</body>二、边框圆角
属性:border-radius: ;
◆正圆:盒子必须是正方形,设置border-radius: 50%;或者自身的一半border-radius: 100px;
效果:
书写样式:
.box {
width: 200px;
height: 200px;
margin: 50px;
background-color: #ccc;
/* border-radius: 100px; */
border-radius: 50%;
}◆胶囊按钮:长方形 border-radius: 高度的一半
效果:
书写样式:
.box2 {
width: 200px;
height: 100px;
margin: 50px;
background-color: blue;
border-radius: 50px;
}◆不规则圆角:连写顺序和内外边距一样
效果:
书写样式:
.box3 {
width: 200px;
height: 200px;
margin-top: 30px;
background-color: #000;
border-radius: 20px 50px;
}
