网页设计框架布局

细节
• • • • • A链接的active和visited 图片放大好与不好 便捷功能 及时响应与响应过度 CSS简写陷阱
பைடு நூலகம்
• • 由于不同浏览器界面不一样,最终设计宽度一般是900-1000之间取 除非一些特殊设计要求,各版块或区域之间一般要求10-20px间距
– 间距
• 结构
– 头部(header)[顶部工具条(topbar),logo区,导航区,banner] – 内容区(container)(banner,内容模块,侧栏,主内容区) – 底部(footer)(友链,底部链接/导航,版权,统计)
• 广告及其它
– – – – 对联广告 内容区广告 客服漂浮框及其它 新鲜工具(回顶部,导航固顶,在线聊天框,状态栏)
常见网页布局
• 标准布局(网易) • 瀑布流式布局(花瓣) • BigPipe
标准布局
• 头部 • 内容区 • 底部
HTML5布局(参考)
• • • • • • • • header标签 container标签 footer标签 nav标签 article标签 summary标签 canvas 一个特殊属性 data-
网页设计布局基础
内容整理:魏晓江
内容要点
• • • • • • HTML与XHTML 一些俗成的约定 布局技术 标准布局 细节 重新认识dtd
HTML与XHTML
• • • • • 标签必须正确嵌套 必须闭合标签 标签名小写 属性必须有 “(引号) 必须包含在html根节点
俗成约定
• 尺寸
– 宽度1003的由来(1024-21滚动条)