1 布局和事件
布局效果如下(标题和内容都居中，两边留空白)
布局代码如下
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>居中布局</title> <style> .header{ height: 48px; background-color:lightgrey; } .body{ background-color: blue; } /*设置宽度并居中*/ .container{ width: 980px; margin: 0 auto; background-color: chartreuse; } </style> </head> <body> <!--网页头部部分--> <div class="header"> <!--这里通过在内层嵌套div标签，并设置class='container'，这样它就相对自己的父标签进行居中--> <div class="container">网页头部</div> </div> <!--网页主体部分--> <div class="body"> <div class="container">网页主体</div> </div> </body> </html>
Bootstrap中的事件：关闭Bootstrap模态对话框(使用Bootstrap提供的方法)
$('#myModal').modal('hide') //其中#myModal是ID选择器
2 a标签属性
对于a标签，当鼠标移动上去之后要显示小手，这个通过属性cursor:pointer来实现；另外对于a标签，当鼠标放上去时怎样取消下划线，这个通过属性text-decoration:none来实现。
3 z-index
通过设置z-index属性，来设计整个页面的层级。
4 圆角
首先我们定义的div标签，默认他是方形的，我们可以通过"border-radius"属性来改变它的形状，看下面的代码：
<!--这里border-radius:百分数，相当于给div设置边框的圆润程度-->
<div style=" 50px;height: 50px;background-color:blue;border-radius:50%"></div>