html中布局框架的划分属性,day03—html之页面布局

页面布局:实现网页的多种排版和布局

网页的布局方式：

表格(table)：

使用

标签划分行列。

框架(frameset)：

rols、cols属性划分行列，配合 标签可划分浏览器。

Div+CSS：DIV定位

1、普通流定位

2、浮动定位：float属性

3、相对定位：position:relation属性

4、绝对定位： position:absolute属性

ps：相对定位与绝对定位都是想对于父节点，父节点可改变。

表格布局：看代码

body{

margin:0px;

}

hr{

color:#E1E5EE;

}

.tableClass{

border:1px solid #E1E5EE;

font-size:12px;

}

.tableClass tr td{

border-bottom:1px solid #E1E5EE;

}

在这里，您可以根据您的需求，填写网站参数！

栏目名称： 设置栏目名称 栏目类型： 请选择 单页 文章列表 设置栏目类型 是否隐藏： 是 否 设置该栏目是否隐藏。用户仍可通过URL访问到此栏目 栏目位置： 顶部 底部 设置栏目的显示的范围与位置 描述: Description 出现在页面头部的 Meta 标签中，有利于SEO

客户服务邮箱： 客户服务邮箱：

效果图如下：

框架(frameset)布局：

HTML中框架标记主要用于划分浏览器窗口

使用 FRAMESET 创建框架

其属性有：

Rows 框架上下划分属性

Cols  框架左右划分属性

FRAME 元素的属性包括：

Name 该框架名称，为超链接和javascript定位

Src 该框架显示的页面

Noresize 框架是否可以伸缩

Scrolling 是否使用滚动条值为:yes no auto

Frameborder 框架是否显示边框，同border一起使用

Marginwidth 框架内页面同框架的宽度距离

Marginheight框架内页面同框架的高度距离

代码如下：

效果图：

内嵌框架：

在当前页面嵌入另外一个页面的内容

IFRAME属性

Name框架名称，为超链接和javascript定位

Width 框架的宽度

Height 框架的高度

Src 框架显示的页面url

代码如下：

day03_02left.html，这是左部区域的代码，其中点击我的资料，会跳转一个页面至day03_02mymsg.html

ul{

list-style-type:none;

}

• 我的资料
• 密码修改
• 退出