您的位置:首页 > Web前端 > CSS

CSS边框与背景[上]

2016-08-04 16:21 162 查看
效果:





index.html:

<!DOTTYPE html>
<html lang ="zh-cn">
<head>

<meta charset="utf-8">
<title>CSS盒边框和背景[上]</title>
<link rel="stylesheet" type="text/css" href="style.css">

</head>
<body>

</body>
</html>

style.css:
@charset "utf-8";

div{
width:200px;
height:200px;

///设置一个边框至少需要以下三条
border-style:solid;
bordr-color:red;
border-width:1px;///用像素最好
///或者将那三条写成一条语句
border:10px solid red;

border-radius:10px;///圆角边框
border-radius:10px 20px 30px 40px;///圆角边框顺时针
border-top-right-radius:10px;///仅仅对右上边框设置圆角

///没有直接像素好用
border-width:thin;
border-width:thick;

border-width:10px;///用像素最好
border-style:none;
border-style:dashed;///破折号边框
border-style:dotted;///圆点边框
border-style:double;///双线边框
///立体感边框
border-style:groove;
border-style:ginset;
border-style:outset;
border-style:ridge;

///最常用边框
border-style:solid;///实线
border-style:dashed;///破折号边框虚线

///单独某条边框设置
border-top:10px solid red;///上边的一条边框



ppt:











内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  css