页面布局整理-01

2. 初始化设置窗体的大小：

   οnlοad= "window.resizeTo(100,100) " 

 

3. 隐藏文本域：

  <input style="background:transparent;border:0px;" value="lalalallalalalla" />

 

4. 层

style="padding-left:100px; padding-top:30PX"  设置层里的内容距层的边距

style = “margin-top: 10px” 设置层于层之间的边距

 

二，盒子模型

1，  设置内边框——padding

2，  要同时应用两个样式：class=“calss1  calss2”;

类别	属性	含义	举例
四个方向	padding-top padding-right padding-bottom padding-left	内容于上边框之间的距离 内容于右边框之间的距离 内容于下边框之间的距离 内容于左边框之间的距离	padding-top：5px padding-right:5px padding-bottom:5px padding-left:5px
书写形式	Padding	在一个申明中统一四个方向的边框属性	padding:1px 2px 3px 4px (按顺时针方向，上填充1px，有填充2px，下填充3px,昨填充4px)

 

2,设置外边距——margin

于内边距一样。

Margin:0px auto      设置对象居中

 

 3，边框 ——border  

类别	属性	含义	举例
修饰属性	border-color border-writh border-style	边框颜色 边框宽度 边框样式，常用值如下：    none,默认无边框    solid,实线    dashed,虚线	border-color:#333333 border-writh:2px border-style:solid
四个方向	border-top border-right border-bottom border-left	上边框 右边框 下边框 左边框	border-top：5px border-right:5px border-bottom:5px border-left:5px
书写形式	Border     Border-left	在一个申明中统一四个方向的边框属性   在一个申明中设置左边框的属性	border:1px  solid #797976 (设置四个方向的边框为1px，红色，实线) Border-left:1px  solid #797976 (设置左边框为1px，红色，实线)

 

三，浮动——float

值	描述
float:left float:right float:none	设置元素左浮动 设置元素右浮动 默认值，不浮动

例：

.cat,.sider{float:left;width:20%;height:100%}

 

四，清楚浮动—clear属性

值	描述	例
Left Right Both none	在左侧不允许有浮动 在右侧不允许有浮动 在左右两侧都不允许有浮动 默认，允许两侧右浮动	#example{    Clear:left;     } （清楚id等于” example”左侧的浮动）

 

五、属性列表

属性	方法	描述
backgrount	backgrount-repeat: background-attachment: background-position:	背景图片是否平铺 背景图片是否固定（fixed固定） 设置背景图片的位置
line	line-height:	设置行间距（行高）
font	font-weight:	设置文字的粗细
	list-style-type:none	去掉ul-li前的黑圆点
	text-align:center	属性规定元素中的文本的水平对齐方式
	vertical-align:middle;	支持valign特性的对象的文本与对象，于文本在垂直方向的对齐方式。