摘要：css常用选择器:标签 id(#) class(.) 派生 属性css的引入方法：内联样式 内部样式 外部样式 优先级：内联样式 内部样式 外部样式css盒模型: element padding border margincss边框： border：solid(实线)double(双)dashed(--)
css常用选择器:标签 id(#) class(.) 派生 属性
css的引入方法：内联样式 内部样式 外部样式
优先级：内联样式 内部样式 外部样式
css盒模型: element padding border margin
css边框： border：solid(实线)double(双)dashed(--) dotted(....)
border-radius:边角弧度 border:none 无边框
border-top left bottom ritght:上 左 下 右
box-shadow:x轴 y轴 宽度 颜色 inset(内部)
css背景控制：复合写法background：url(图片路径) no-repreat(不平埔) center
top（ 位置）
块级元素和行内元素的相互转换: display:inline(块级元素转化为行内元素)
display:block(将行内元素转化为块级元素)
子级display:none(隐藏) displau:block(显示)
定位：relative(相对于自身的位置)absolute(相对于父级的位置)
浮动：float:left right(向左 向右) clear:both(清除浮动)
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>案例</title>
<style type="text/css">
*{padding:0px;margin: 0px;}
.top{width: 100%;height: 100px;box-shadow: 0px 6px 30px blue inset;line-height: 100px; text-align: center;font-weight:bold ;font-size:50px; }
div{width:100px;height:50px;text-align:center;background-color:#ccc;line-height:50px;margin-top:5px; }
body{background-image: url(images/2.jpg)}
div a{text-decoration: none;}
a[href="#"]{color: #000;}
a:hover{color: red;}
</style>
</head>
<body>
<div>css学习总结</div>
<div><a href="#">选择器</a></div>
<div><a href="#">盒模型</a></div>
<div><a href="#">边框样式</a></div>
<div><a href="#">背景设置</a></div>
<div><a href="#">元素间转换</a></div>
<div><a href="#">定位</a></div>
<div><a href="#">浮动</a></div>
</body>
</html>
批改老师：灭绝师太批改时间：2018-11-28 16:29:54
老师总结：完成的不错，这些标签在后面的布局中经常使用，要做到灵活运用
