HTML+CSS标签的属性及应用

结构化标准语言(HTMLHTMLHTMLXMLXMLXMLXMLXMLXMLXML)

表现标准语言(CSS)C

块级标签:divdiv、ulul、lilili、dtdl、dldt...

行内标签:spanspan、inputinput、imgspanimg...

行为标准语言(DOMDOM和ECMAScriptECMAScriptE

盒子模型==网页布局的基石

外边距(margin)边框(borderborder)内边距(paddingpaddingleft、left right、right、bottombottom

如果设置的是外边距(以顺时针方向设置):给44个值(上、右、下、左),给定三个值(上、左右、下),给定两个值(上下、左右)、给定一个值(就是4个方向的外边距是一样的)

auto会根据浏览器的宽度自动地设置两边的外边距width:100%;margin:0 auto;width:100%;margin:0 auto;;如果设置了自动居中还设置了floatfloatfloatfffffloat(浮动)或者position:absolute;position:absolute;当元素没有设置宽度值,而设置了浮动属性,元素的宽度随内容的变化而变化。

清除浮动的方法:

1.clear属性--常用clearclear:bothboth;clearclear:leftleft;或者clearclear:rightrightright

2.同时设置widthwidthwidth:100%100%width(或者固定宽度)+overflow+overflow:hidden;

 

横向两列布局

 

主要应用技能:floatfloat属性-----------使纵向排列的块级元素,横向排列

 

绝对定位布局:通过设置positionposition属性实现

 

 

能够实现横向布局及较为复杂的定位,有三种定位形式:1.静态定位 2.相对定位 3.绝对定位

 

可以设置4个属性值:

 

static(静态定位)

 

relative(相对定位):相对于自身原有位置进行偏移,仍处于标准文档流中,随即拥有偏移属性和z-indexz-indexz属性

 

absolute(绝对定位) :建立了以包含块为基准的定位,完全脱离了标准文档流,随即拥有偏移属性和z-index属性,当一个元素设置了绝对定位,该元素的快读随着内容的变化而变化。

 

无已定位祖先元素,以<html><html><><>为偏移参数基准;有已定位祖先元素,以距其最近的已定位祖先元素为偏移参照基准。

 

fixed(固定定位)

 

posted @ 2016-03-24 11:25  释然的蛋  阅读(451)  评论(0编辑  收藏  举报