页面布局怎么设置
浮动可以实现元素的水平排列,通过浮动和定位基本上就能定位整个页面的布局,西安SEO整理的笔记如下: 浮动设置方法: 第一种:设置display为inline 第二种:使用浮动。 定义语法:float:left|right|none|inherit 值 描述 left 元素向左浮动 right 元素向右浮动 none 默认值,元素不浮动,并会显示在其文本中出现的位置。 inherit 规定应该从父元素继承float属性的值。 浮动–双边距 在IE6下,块级元素有浮动和横向的margin时,横向的margin值会被放大成两倍。解决办法;设置display:inline 清除浮动 最小高度设置在IE6/IE7中,高度小于19px的元素,高度会当做19px来处理 解决办法: 1、设置font-size:0 2、设置over-flow:hidden; 定位position 语法:position:static(默认值,没有定位)|relative(相对定位) absolute(绝对定位)|fixed(固定定位) 元素的位置通过“left”“top”“right”,以及“bottom”属性进行定位 相对定位relative 不脱离文档流(如果对一个元素进行相对定位,首先它将出现在它所在的位置上)通过设置垂直或者水平位置,让这个元素“相对于”它的原始起点进行移动。 1、仅使用left、right、top和bottom属性布局相对定位元素 2、仅使用margin属性布局相对定位元素的情况(left、right、top和bottom负值可改变文档流中所占空间的高度,会影响文档流中的其他元素位置。) 3、混合使用left、right、top和bottom与margin属性布局相对定位元素的情况 绝对定位absolute 格式position:absolute; 脱离文档流 偏移位置以最近的定位祖先元素做参照物,如果元素没有已定位的祖先元素,那么它的参照物为最顶级元素(由于浏览器的默认参照物不同,可能是BODY或者HTML元素)。 1、仅使用left、right、top和bottom属性布局绝对定位元素的情况(IE下参照物需设置宽度或者高度bottom和right属性才可以正确的定位) 2、仅使用margin属性布局绝对定位元素的情况 3、混合使用left、right、top和bottom与margin属性布局相对定位元素的情况 4、margin属性和top、bottom、right属性同时使用,如果同一方向偏移,它们的值会产生累加的效果。 5、绝对定位和相对定位的累加效果不同,如果top、bottom、left、right属性和margin属性偏移的方向相反,top、bottom、left、right属性值有效,反方向的margin属性值无效。 G M T Detect languageAfrikaansAlbanianArabicArmenianAzerbaijaniBasqueBelarusianBengaliBosnianBulgarianCatalanCebuanoChichewaChinese (Simplified)Chinese (Traditional)CroatianCzechDanishDutchEnglishEsperantoEstonianFilipinoFinnishFrenchGalicianGeorgianGermanGreekGujaratiHaitian CreoleHausaHebrewHindiHmongHungarianIcelandicIgboIndonesianIrishItalianJapaneseJavaneseKannadaKazakhKhmerKoreanLaoLatinLatvianLithuanianMacedonianMalagasyMalayMalayalamMalteseMaoriMarathiMongolianMyanmar (Burmese)NepaliNorwegianPersianPolishPortuguesePunjabiRomanianRussianSerbianSesothoSinhalaSlovakSlovenianSomaliSpanishSundaneseSwahiliSwedishTajikTamilTeluguThaiTurkishUkrainianUrduUzbekVietnameseWelshYiddishYorubaZulu AfrikaansAlbanianArabicArmenianAzerbaijaniBasqueBelarusianBengaliBosnianBulgarianCatalanCebuanoChichewaChinese (Simplified)Chinese (Traditional)CroatianCzechDanishDutchEnglishEsperantoEstonianFilipinoFinnishFrenchGalicianGeorgianGermanGreekGujaratiHaitian CreoleHausaHebrewHindiHmongHungarianIcelandicIgboIndonesianIrishItalianJapaneseJavaneseKannadaKazakhKhmerKoreanLaoLatinLatvianLithuanianMacedonianMalagasyMalayMalayalamMalteseMaoriMarathiMongolianMyanmar (Burmese)NepaliNorwegianPersianPolishPortuguesePunjabiRomanianRussianSerbianSesothoSinhalaSlovakSlovenianSomaliSpanishSundaneseSwahiliSwedishTajikTamilTeluguThaiTurkishUkrainianUrduUzbekVietnameseWelshYiddishYorubaZulu Text-to-speech […]