爱易网
IT新闻
IT新闻
爱易资讯
网站搭建
云虚拟主机教程
云服务器教程
Apache教程
IIS教程
Nginx教程
网站策划
站长文章
推广教程
淘宝客教程
网页设计
HTML教程
XHTML教程
CSS教程
HTML5教程
CSS3教程
JavaSript基础
JQuery教程
Node.js教程
前端技术
Ajax教程
Js特效
Xml教程
平面设计
页面UI设计
photoshop教程
程序开发
AI人工智能
Asp教程
Php教程
Asp.Net教程
Net Core教程
C#教程
Java教程
Jsp教程
开发技术
微信小程序教程
Uniapp开发教程
微信公众号开发
Andriod教程
IOS教程
DOS教程
Python教程
Docker教程
Windows Container教程
数据库
MSSQL教程
MySQL教程
Redis教程
Access教程
Oracle教程
数据库教程
操作系统
Linux教程
Windows教程
MAC教程
Cisco教程
交换机教程
防火墙教程
搜索
爱易网页
CSS教程
高度和宽度自动顺应的一个例子
高度和宽度自动顺应的一个例子
日期:2013-10-14 浏览次数:21159 次
HTML代码
<head><title>test</title><meta http-equiv="Content-type" content="text/html; charset=gb2312"/><style type="text/css" media="screen">#outer{ display:table; width:100%;}#outer div{ display:table-cell;}#left{ background:#900; width:100px;}#center{ background:#CCC;}#right{ background:#369; width:200px;}</style><!--[if lt ie 7]><style type="text/css" media="screen">#outer{ display:block; position:relative; width:80%; background:#EEE;}#outer div{ display:block;}#left{ position:absolute; background:#900; top:0; left:0; width:100px;height:expression(outer.clientHeight+"px");}#center{ margin:0 200px 0 100px; background:#CCC;height:expression(Math.max(left.clientHeight,right.clientHeight)+"px");}#right{ position:absolute; top:0; right:0; background:#369;width:200px; height:expression(outer.clientHeight+"px");}</style><![endif]--></head><body> <div id="outer"> <div id="left">leftcolumn</div> <div id="center">center column</div><div id="right">right column right column right column rightcolumn right column right column right column right column right columnright column right column right column right column right column rightcolumn right column right column right column right column right columnright column right column right column right column right column rightcolumn right column right column right column right column rightcolumn</div> </div></body>
上一篇:CSS控制字符长度和显示长度
下一篇:判别阅读器类型屏幕分辨率自动调用不同CSS的代码
免责声明:
本文仅代表作者个人观点,与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实,对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺,请读者仅作参考,并请自行核实相关内容。
相关资料
更多>
IE6中背景属性加a与a:hover效果
css如何运用像历来定位背景图像 css实例
网页设计技巧:网页实用字符图标代替图片
import与link的详细区别
网页排版CSS教学第三章 CSS的运用补充
IE中选择符的4095限制
CSS3网页制作实例:模仿新浪微博首页变化信息
css3制造网页实例:点击切换不同的CSS列表
定义链接的样式CSS
推荐阅读
更多>
CSS控制图片代码:让网页图片自顺应大小
IE6中背景属性加a与a:hover效果
CSS3教程:Transform-变形处置
CSS规划实例:margin优化的一种思绪
CSS如何为同一个元素处置多种规则
用DIV做不规则外形的盘绕文字
css技巧:经典CSS运用技巧几则
用CSS写出的网页静态表格交替颜色的效果
依据判别阅读器类型屏幕分辨率自动调用不同CSS的代码
简明教程 SPAN和DIV的区别
CSS学习教程:详解margin属性
css网页制造技巧:margin负值和bug的处置
CSS罕见的让元素水平居中显示的方法
两种方式完成的文字竖排效果
最小高度100%页脚坚持在底部的规划方法
网页制造阅历:id与class的运用准绳
运用CSS处置网页在IE和Nascape的显示差异
CSS编辑器:TopStylePro运用技巧
适用的CSS罕见的效果和技巧总结
iPad创立复杂的演示目的CSS的页面