第四章设计页面布局 41网页版面布局概述 42实例导入:表格排版网页 使用表格排版 使用层排版 时间轴特效及行为 46)使用框架排版网页
第四章 设计页面布局 4.1 4.2 4.3 4.4 4.5 4.6 网页版面布局概述 实例导入:表格排版网页 使用表格排版 使用层排版 时间轴特效及行为 使用框架排版网页
4.1网页版面布局概述 的是奶中个的之牌疆 高交受面时含司峡 800*600像 024*768 最适合浏览的方式将片和文字摆放在 不同位 网贩面布信是指定防交内容在测中的 的 经背电到的殷雷局结构 星數着联旱神 主要内容的排版 “T”结构布局 网站 有内举的布局因单系 花[表单 集类似 这字智上是网页设计中用的量人影的二种布后 页面 次分明 着盼3方若之规矩板,如集组节和色彩工不意
4.1 网页版面布局概述 网页版面布局是网页设计中的一项重要内容。版面指的是浏 览器看到的完整的一个页面。因为每个人的显示器分辨率不同, 所以同一个页面的分辨率可能出现800*600像素,1024*768 像素等。布局,就是以最适合浏览的方式将图片和文字摆放在 页面的不同位置。网页版面布局是指定网页内容在浏览器中的 显示方式,例如徽标的位置、导航栏的显示、主要内容的排版 等。经常用到的版面布局结构主要有以下几种: ❖ “T”结构布局 页面顶部为横条的网站标志、广告条,下方左面为主菜单, 右面显示内容的布局,因为菜单条的背景较深,整体效果类似 英文字母“T”,这是网页设计中用的最广泛的一种布局方式。 这种布局的优点是页面结构清晰,主次分明。是初学者最容易 上手的布局方法。缺点是规矩呆板,如果细节和色彩上不注意, 很容易让人“看之无味”
4.1网页版面布局概述 ◆“口”型布局 这是一个象形的说法,就是页面一般上下各有一个广 条,左面 石面是友情连接等中间是主要内 拥挤,不够霑。兰型希·信量大试点是成念 这种布局 充分利成面 这种布局多用于国外站点,国内用的不多 是页面 横向两条色块, 面整体分割为四部分,色块中大多 告条
❖ “口”型布局 这是一个象形的说法,就是页面一般上下各有一个广告 条,左面是主菜单,右面是友情连接等,中间是主要内容。 这种布局的优点是充分利用版面,信息量大。缺点是页面 拥挤,不够灵活。 “三”型布局 这种布局多用于国外站点,国内用的不多。特点是页面 上横向两条色块,将页面整体分割为四部分,色块中大多 放广告条。 4.1 网页版面布局概述
4.1网页版面布局概述 POP布局 PoP引自广告术语,就是指页面布局像一张宣传海报 以一张精美图片作为页面的设计中心。常用于时尚类站点 匕如 ELLE. con。优点显而易见:漂亮吸引人。缺点就是速 度慢。 在确定好版面布局结构后,继续要做的就是梖据内容调 整页面的结构。如页面尺寸选择多大?怎样放置网页的网 页元素?在 Dreamweaver中提供了四种主要的方法用于 规划和设计页面:表格、层、框架和cSS+DI,本章只 介绍前三种方式
4.1 网页版面布局概述 ❖ POP布局 POP引自广告术语,就是指页面布局像一张宣传海报, 以一张精美图片作为页面的设计中心。常用于时尚类站点, 比如ELLE.com。优点显而易见:漂亮吸引人。缺点就是速 度慢。 在确定好版面布局结构后,继续要做的就是根据内容调 整页面的结构。如页面尺寸选择多大?怎样放置网页的网 页元素?在Dreamweaver中提供了四种主要的方法用于 规划和设计页面:表格、层、框架和CSS+DIV,本章只 介绍前三种方式
4.2实例导入:表格排版网页 XXXXX生物工程公司 乳酸管养品 A 专家的评价 实验报告 专家谈XX乳酸营养素与微量元素的补充 询购买 司简介 同是的三平面的件元是元能 代理中请 锌,钙,都是人体必须的元素,是人体 能必要组成部 多如钙元素,则其他元素如铁,锌的吸收就减少,另外,体内各元素的状态对这些元 类比的和合的,这样它们才可能有效的收和利用,子保持建地成长和 摘目《矿物质营养与斯强乳营养 中华儿童保健杂志将安会副主任主满 姚凯南高级射授 p③根 生物工程公司 地址:x 电话:029-8416557 网址http://rnw.abe.cos
4.2 实例导入:表格排版网页