css学习笔记二

表格样式:

caption{　　　　　　　　　　　　　　　表格标题　　

　　　　caption-side:bottm;　　　　　　至底显示

}

table{

　　　　border-collapse:collapse;　　　　边框重叠

}

========================================================================================================================================

p{

　　cursor:pointer;　　　　　　　　　　鼠标经过时变手指

}

a{

　　text-decoration:none;　　　　　　　去掉超链接下划线

}

ul{

　　list-syle-type:none;　　　　　　　　去掉开头符号

}

======================================================================================================================================

块级元素：

1、块元素里面的内容默认显示在左上角。

2、块元素单独占满一行（存在于文档流）。

常用块元素：

div、p、h1-h6、ol（li）、ul（li）、dl、dt、dd、body、table、pre、form

行内元素（内联元素）：

1、高度宽度不起作用。

2、不会单独占满一行。

常用行内元素：

a、span、input、lable、img、textarea、select

span{

　　display:block;　　　　　　行内元素切换成块级元素

}

#d1{

　　float:left　　　　　　　　块元素并排漂浮在左边（有多个块元素的话需同时设置float）

　　clea：left　　　　　　　清除浮动影响

}

======================================================================================================================================

盒子模型：

padding(内间距)

margin(外间距)

#d1{

　　width:100px;

　　height:100px;

　　border:solid 1px red;

　　padding:10px;　　　　　　　　　　内间距上下左右增加10px

　　padding:10px 20px;　　　　　　　内间距上下增加10px，左右增加20px

　　padding:10px 20px 30px;　　　　　内间距上面增加10px，左右增加20px，下面增加30px

　　padding:10px 20px 30px 40px; 　　内间距从上面开始顺时针方向增加10，20，30，40px

　　padding-top:30px　　　　　　　　内间距从上面增加30px

　　margin:10px　　　　　　　　　　外间距与内间距写法相同

}

一般默认情况下浏览器会给标签添加间距，若想让标签顶格显示，需在css文件中加入

*{

　　padding:0px;

　　margin:0px;

}

如何让块元素标签居中显示：

#d1{

　　margin:0px auto;

}

如何让块元素标签中的列表居中显示：

ul{

　　list-style-type:none;

　　width:51px;

　　height:44px;

　　margin:0px auto;

}

间距对行内元素也有用

转载于:https://www.cnblogs.com/ybtest/p/7414254.html