css基础01

设置关键字<meta name="keywords"  content="*******">设置描述<meta name="description"  content="*******">设置作者<meta name="author"  content="*******">设置字符集<meta http-equiv="content-type" content="text/html;charset=gb2312">设置关键字<meta http-equiv="refresh"  content="2;URL=http://www.baidu.com"/>语义加权<strong><em> 空格"引号&  &<   < >   ><ul type="circle|square|disc"></ul><ol>   //type start</ol><dl><dt></dt><dd></dd><dd></dd><dd></dd><dt></dt><dd></dd><dd></dd><dd></dd></dl>

通配符*{  margin:0;  padding:0;}//重置所有元素的内边距和外编剧但是通配符的效率低选择符的嵌套使用：包含选择符针对某个元素中的子元素进行控制父元素 子元素{}选择符分组对多个选择符进行统一控制，对选择符用逗号隔开p,div,#id,.class{}盒子模型一个盒子是由以下几部分构成的1.盒子的内容---content2.盒子的边框---border3.盒子的边框与内容的距离，成为填充---paddig4.多个盒子存在，盒子与盒子之间的距离--margincss盒子的相关属性1.内容属性：内容本身的宽width;内容本身的高：height2.内填充：内容与边框之间的距离padding(上右下左  顺时针)padding：10px;//表示上下左右都是10pxpadding: 20px 30px;//表示上下20px，左右30px(按照上右下左顺序，如果没有值，去对面找)padding:10px,20px,30px;//上 左右 下*****将所有用到的元素内外边距初始化为0body,div,li,ul{paddig:0;margin:0;}3.边框属性：borderborder: 粗细 样式  颜色border: 2px solid blue;css中元素的分类在布局的时候会将html标签分为两种：块元素和内联元素div p 就是快元素 a span是内联元素块元素：能设置宽高，独占一行，默认display:block(让块变内联inline)内联元素：不能设置宽高，不影响换行，就像橡皮筋包住字，默认display:inlinecss控制背景background-repeat:no-repeat;不平铺；默认是repeat在横向和纵向上平铺background-position:right bottom;//右下角background-position:center center;//水平垂直都居中background-position:100px,200px;//距离左边100px距离上边200pxbackground-attachment:scroll;//背景图片随着对象滚动background-attachment:fixed;//背景图片不随着对象滚动（固定在可视区域的某个位置）浮动布局 float：left定位布局： position:absolute;top:20px;left:20px;浮动就是将块元素的独占一行的属性取消，允许别人跟他一行，就是从原来的文档流分离出来 ul,li默认情况下是块元素如果想让多个块显示在同一行中，可以将这些块都设置为浮动，并且浮动方向相同******浮动：先浮后动，浮动的对象先飘起来，后面的对象会向他原来的位置动起来（排队买票）消除浮动：就是可以去掉前面对象浮动对后面对象的影响clear:none:默认值不清楚left:不允许前面左浮动的影响right:清除前面元素右浮动的影响both:清除前面元素浮动的影响为什么原来在同一行的两个快会因为浏览器窗口的大小改变而改变原来的位置。在左右两个快加一个父元素，用来控制两个块总体的宽度margin: 0 auto;margin后面如果只有两个参数的话，第一个表示top和bottom，第二个表示left和right因为0 auto，表示上下边界为0，左右则根据宽度自适应相同值（即居中）当父元素没有指定高度并且子元素有浮动的时候，这个父元素的高度不会自动增加。1.额外标签法在父元素的末尾增加一个空的盒子clear:both;强迫容器适应它的高度以便装下所有的float元素<div><div left>left</div><div left>left</div><div clear:both>clear</div>//增加一个空div </div>2.css中溢出的使用 给父元素设置overflow:hidden设置当对象的内容超过对象指定的高度和宽度的时候如何管理内容。overflow:visible//不剪切内容也不添加滚动条auto//在必须的时候对象内容被裁切或者添加滚动条hidden//不显示超过对象尺寸的内容scroll//总是显示滚动条

********定位布局：通过元素的position属性控制元素的位置position:static:默认absolute:绝对定位，也是从原来的文档刘分离出来，他是相对于父元素来定位，使用绝对定位时候，有两个必要条件1.给父元素加定位属性一般建议使用position:relative2.给子元素加绝对定位，position：absolute绝对定位是以父元素为基准点，绝对定位会脱离文档流相对定位是以自身为基准点，相对定位还占着原来的文档流。