资讯专栏INFORMATION COLUMN

CSS基础篇--可扩展性的页面布局

CarlBenjamin / 3332人阅读

摘要:左右结构,左边右边宽度固定代码代码左右结构,左边固定,右边代码代码左中右结构,左边固定,右边固定,中间代码代码这里是左边这里是中间这里是右边

1.左右结构,左边100%;右边宽度固定

css代码:


HTML代码:


2.左右结构,左边固定,右边100%


css代码:


HTML代码:


3.左中右结构,左边固定,右边固定,中间100%


css代码:


HTML代码:


这里是中间

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/110828.html

相关文章

  • CSS基础--页面实现两列布局,一列固定宽度,一列宽度自适应方法

    摘要:不管是左是右,反正就是一边宽度固定,一边宽度自适应。博客园的很多主题也是这样设计的,我的博客园博客也是右侧固定宽度,左侧自适应屏幕的布局方式。与配合使用首先我们调整一下结构自适应区固定宽度区代码这样实现,的实际宽度就是屏幕宽度。 我在前面有一篇文章《CSS基础篇--可扩展性的页面布局》中介绍了如下三种布局方式:1.左右结构,左边100%;右边宽度固定2.左右结构,左边固定,右边100%...

    RichardXG 评论0 收藏0
  • CSS学习笔记(十六) CSS最佳实践之可维护性

    摘要:国内各大公司都已经投入使用,在一些常见的网站,如淘宝腾讯小米等移动站点,随处可见其踪影。变革之腾讯手机淘宝的设计与实现前端乱炖适配总结样式重置上文已提及,这里推荐阅读同学写的专题文章。 前言 CSS代码难维护众所皆知。 为一个元素设置样式的方式可以通过定义的class、定义的id、元素的标签名、元素的属性等选择器以及这些选择器的组合来实现; 作用于某个元素上的样式又可能来自单个样式规...

    newtrek 评论0 收藏0
  • CSS学习笔记(十六) CSS最佳实践之可维护性

    摘要:国内各大公司都已经投入使用,在一些常见的网站,如淘宝腾讯小米等移动站点,随处可见其踪影。变革之腾讯手机淘宝的设计与实现前端乱炖适配总结样式重置上文已提及,这里推荐阅读同学写的专题文章。 前言 CSS代码难维护众所皆知。 为一个元素设置样式的方式可以通过定义的class、定义的id、元素的标签名、元素的属性等选择器以及这些选择器的组合来实现; 作用于某个元素上的样式又可能来自单个样式规...

    keke 评论0 收藏0
  • 前端每周清单半年盘点之 CSS

    摘要:前端每周清单专注前端领域内容,以对外文资料的搜集为主,帮助开发者了解一周前端热点分为新闻热点开发教程工程实践深度阅读开源项目巅峰人生等栏目。它能够为我们提供类似于预处理器命名空间等多方面的辅助。 前端每周清单专注前端领域内容,以对外文资料的搜集为主,帮助开发者了解一周前端热点;分为新闻热点、开发教程、工程实践、深度阅读、开源项目、巅峰人生等栏目。欢迎关注【前端之巅】微信公众号(ID:f...

    RaoMeng 评论0 收藏0
  • [译]148个资源让你成为CSS专家

    摘要:层叠样式表二修订版这是对作出的官方说明。速查表两份表来自一份关于基础特性,一份关于布局。核心第一篇一份来自的基础参考指南简写速查表简写形式参考书使用层叠样式表基础指南,包含使用的好处介绍个方法快速写成高质量的写出高效的一些提示。 迄今为止,我已经收集了100多个精通CSS的资源,它们能让你更好地掌握CSS技巧,使你的布局设计脱颖而出。 CSS3 资源 20个学习CSS3的有用资源 C...

    impig33 评论0 收藏0

发表评论

0条评论

CarlBenjamin

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<