深山工作室 >

超强的中间自适应,左右固定,有许多值得学习的地方

以下为详细代码

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="keywords" content=""/>
<meta name="description" content="" />
<link href="#" type="text/css" rel="stylesheet" rev="stylesheet" media="screen" />
<title>中间自适应,左右固定</title>

<style type="text/css">
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td {padding:0;margin:0;}
h1,h2,h3,h4,h5,h6 {font-weight: normal;font-size: 100%;}
ol, ul{list-style: none}
table{border-collapse: collapse;border-spacing:0}
p {line-height:1.4em; font-size:100%; margin:0.5em 0 0 0;}
fieldset,img{border:0;}
address,caption,cite,code,dfn,em,th,var{font-style:normal;font-weight:normal;}
li{list-style:none;}
caption,th{text-align:left;}
q:before,q:after{content:'';}
abbr,acronym {border:0;font-variant:normal;}
sup {vertical-align:text-top;}
sub {vertical-align:text-bottom;}
input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit;}
buttom{padding:0;}
#top{height:123px;width:100%;background:#000;}
#left{left:0;top:123px;width:180px;background:#c5e5ff;position:absolute;}
#right{position:absolute;right:0;top:123px;width:170px;background:#e9ecef;}
#contact{background:#ff9900;width:auto;margin:0 170px 0 180px;}
</style>
</head>
<body>
		<div id="top">头部</div>
		<div id="contact">
		这个中间部分是优先于左侧与右侧先进行显示的。中间自适应
		<p>据报道，7月28日</p>
		</div>
		<div id="left">左边</div>
		<div id="right">右边</div>
</body>
</html>

前一页:css里media属性详解

后一页:DIV+CSS做的透明菜单兼容IE、FF等

相关阅读: Appium获取手机分辨率 & 自适应设备下滑刷新; 手机网站; 全部功能介绍; 微信公众号用户关注时自动推送回复小程序卡片(图文卡片)不需要第三方平台就可以做; 如果你每天上网超过4个小时请按照以下方法做。; 这个超级强的div+css图片大小自适应; 告诉你一些GOOGLE搜索你不知道的东西; 超级实用且不花哨的js代码大全( 7 )

更多>>DIV+CSS相关信息: jquery设置或获取修改classname; 利用css3.0写出一个音乐播放的唱片碟盘的效果; 利用css中的scale()实现放大缩小效果; 利用background-color:#000000a8在背景颜色16进制代码之后加字母加上数字让背景色透明; css背景使用base64编码或者将base64编码放在img图片标签中

更多>>最新添加: dw里面查找替换使用正则删除sqlserver里面的CONSTRAINT; Android移动端自动化测试：使用UIAutomatorViewer与Selenium定位元素; 抖音直播音挂载小雪花懂车帝小程序; javascript获取浏览器指纹可以用来做投票; 火狐Mozilla Firefox出现：无法载入您的Firefox配置文件它可能已经丢失或是无法访问问题解决集合处理办法

服务热线: 13961347334

: 微信公众号二维码

: 百度小程序二维码

: 头条抖音小程序二维码

: 联系微信二维码

: 联系QQ二维码

Copyright © 深山工作室 All Rights Reserved
服务QQ:565449214 手机:13961347334
ICP备案:苏ICP备15019627号
苏公网安备 32070502010230号