html复习七--CSS学习2----padding/border/margin
CSS学习2----padding/border/margin 2012-07-11 23:40:12
原创作品，允许转载，转载时请务必以超链接形式标明文章 原始出处 、作者信息和本声明。否则将追究法律责任。http://hanchaohan.blog.51cto.com/2996417/928259
1.padding是内容和内容的边框之间的空间。
2.border是指画在方框的每一边的直线。可以是一边或者任何边的组合。
3.margin是指一个标签和另一个标签之间的间隔。
4.他们都有四个属性：margin-left,margin-right,margin-top,margin-bottom;
padding-left,padding-right,padding-top,padding-bottom;
5.一般用像素定义一个尺寸，如margin-right:20px;
当定义四边时，还有更快捷的设定方式，如下：
margin:10px 15px 10px 25px;
padding:0px 10px 15px 20px;
这四个值的顺序非常重要，分别代表top,right,bottom,left;
eg.
p{
border:1px solid #666666;
padding:10px 10px 10px 10px;
margin:0px;
}
body{
margin:0px;/*★让body的边框紧靠着网页边框。*/
}
6.边框碰撞问题：如果两个边框碰撞，浏览器不会把两个边框的值相加，而是会采用最大的那个边框。
7.<span>xxxx</span>
8.我们常用的块级标签：div、p、h1~h6 、表格、列表。
9.行内标签为：strong、span、img、超链接、各种表单标签。
10.在大多数情况下，CSS对待块级标签和对待行内标签是相同的，
你可以定义样式给文字、颜色、背景等，但是margin和padding比较特殊。
11.块级标签是独占一行的！！！
12.★
使块级标签产生如行内标签一样的效果：display:inline;
使行内标签产生如块级标签一样的效果：display:block;
display还有一个特殊的值none,它可以隐藏样式元素，使他不会在浏览器上出现。
13.在CSS中每个边框有3个属性可以控制：color(颜色)、width(宽度)、style(样式);
style常用的属性：solid(实线)、dashed(虚线)、none、hidden。
（说明：其中none和hidden的作用是一样，它们都完全除去了边框，
none值对于取消单独的一条边框很有用。）
eg.
div{
border:1px solid #444; /*使用border来设置属性*/
border-bottom:none;
padding:10px;
}
14.★可以使用border-方向-width和border-方向-style两个属性来改变边框的宽度和样式。
eg.
border-bottom-style:solid;
border-bottom-width:3px;
15.★技巧性的东西：
《1》。让一个div居中
div{
margin-left:auto;
margin-right:auto;
}
《2》。让一个div自动增长
div{
width:400px;
height:auto;
overflow:auto;
}
16.overflow的3个属性值：
①visible:浏览器的通常的做法，默认使用。
②hidden:隐藏。
③scroll:添加滚动条，不幸的是只要使用这个选项，即使内容很少，滚动条也会出现！
④auto:在需要的时候，自动添加滚动条。
17.注意事项：
★margin是不改变网页的大小的！！
对于一个标签加padding时，会改变网页的大小。
eg.
一个网页的宽度为960px
div{
paddind-left:10px;
width:950px; /*这样网页的宽度始终为960px。*/
}
18.★给网页添加背景图片
div{
background-image:url(1.png); → 默认是平铺。
background-repeat:no-repeat; → 不平铺；（logo用的多）
background-repeat:repeat-x; → 只平铺X轴。
background-position:10px(距左的像素) 30px(距上的像素);
center center;
left bottom;
right top;
832px -128px;
}
本文出自 “我的JAVA世界” 博客，请务必保留此出处http://hanchaohan.blog.51cto.com/2996417/928259
