[翻译]标记语言和样式手册 Chapter 12 CSS布局（4）
作者：zhaozy 来源：3user.com 发布时间：2008-02-13 14:19:00
标签：布局,样式,标记,css,手册
方法B:双重浮动
<div id="header">
...header content here...
</div>
<div id="content">
...main content here...
</div>
<div id="sidebar">
...sidebar content here...
</div>
<div id="footer">
...footer content here...
</div>
方法A的缺点之一是:为了浮动侧边栏,则必须在标记源代码之内把侧边栏放到主内容<div>的前面,关闭CSS的浏览器,文字浏览器,屏幕阅读器与其他不支持CSS的设备将会在页面主要内容之前显示(或念出)侧边栏的内容.这样实在不严谨.
我们可以利用float做法,并避开这个问题,只要交换标记源代码里的主内容,侧边栏<div>的位置(如上所示),然后以CSS将两者浮动到不同边即可.
#header {
padding: 20px;
background: #ccc;
}
#content {
float: left;
width: 66％;
}
#sidebar {
float: right;
width: 30％;
background: #999;
}
#footer {
clear: both;
padding: 20px;
background: #eee;
}
通过把两个<div>浮动到不同方向,就能以最恰当的方式排列源代码(主内容放在侧边栏前面),同时仍能得到图12-4这样的效果.
避开两边
同样重要的是,你必须将#footerdeclear属性设为both,如此一来不管两栏的长度多长,页尾总是显示在最后,而标签源代码的内容顺序也改善了.
0
投稿猜你喜欢
[code]<script> var a=4.2343; alert(a.toFixed(3)); </script>- 大家提供了许多linux开代理的方法，一般用到python等语言，一些服务器可能不会安装，然而perl可以说是linux标配的语言，给大家一
- renderer是Go语言的一个简单的、轻量的、快速响应的呈现包，它可以支持JSON、JSONP、XML、HYAML、HTML、File等类
- 逻辑斯蒂映射在混沌数学中是一个很经典的例子，它可以说明混沌可以从很简单的非线性方程中产生。逻辑斯蒂映射公式如下：x_n表示当前人口与最大人口
- 导语：哈喽，在经历了过年相亲这一环节，成了是好事💗，不成也是多认识一个人，见见"世面"，也可以“开拓”一下眼界，说不定遇
- （本章节主要是一些python的基础语法，具体内容不够详细，以pycharm下调试产生的部分代码为主）（python语法的详细内容请参考官方
- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN&
- 昨天在网上找资料的时间无意进了一个站，糊里糊涂就进去了，想提权提不起来，后来加上服务商的Q号想社工一下，射了半天得知服务器的安全是绿盟的人给
- 一、什么是异常在python中，错误触发的异常如下二、异常的种类在python中不同的异常可以用不同的类型去标识，一个异常标识一种错误。1
- 编程零基础，可以学习 Python 吗”，这是很多初学者经常问我的一个问题。当然，在计算机方面的基础越好，对学习任何一门新的编程语言越有利。
- Python读写word文档有现成的库可以处理。我这里采用 python-docx。可以用pip install python-docx安装
- 提到分发请求，相信大多数人首先会想到Nginx，Nginx作为一种多功能服务器，不仅提供了反向代理隐藏主机ip的能力，还拥有简单的缓存加速功
- 空白双边距是一个极容易误解的CSS特性.它不是CSS的bug,但如果我们一旦误解,将会给你带来很多麻烦.先看如下demo代码:<!do
- 1、golang中获取请求接口中数据(GET)方式一： API参数 ctx.Param(name string)或者ctx.Params.B
- Python字符串的format函数format()函数用来收集其后的位置参数和关键字段参数，并用他们的值填充字符串中的占位符。通常格式如下
- 一、Mysql SQL Mode简介通常来说MySQL服务器能够工作在不同的SQL模式下，并能针对不同的客户端以不同的方式应用这些模式。这样
- 本文实例为大家分享了PyQt5实现简单计算器的具体代码，供大家参考，具体内容如下下面我们将介绍使用python的PyQt5图形界面来编写一个
- 随着WEB标准在国内的不断普及，结构表现行为分离、模块化、语义化、优雅退化等概念也成为考核一名前端人员对WEB标准理解的重要条目，其中，由于
- golang中默认使用一个CPU，这时程序无法并发，只能是并发。因为始终只有一个CPU在运行。package main import ( &
- 前言本文介绍CentOS7使用yum安装golang一、go语言介绍Go语言 是Google公司 在2007开发一种静态强类型、编译型语言，
