需要掌握的八个CSS布局技巧
来源:52design 发布时间:2008-05-17 11:45:00
1.若有疑问立即检测
在出错时若能对原始代码做简单检测可以省去很多头痛问题。W3C对于XHTML与CSS 都有检测工具可用,请见 http://validator.w3.org 。请注意,在文件开头的错误,可能因为不当的结构等因素造成更多错误;我们建议先修正一些最明显的错误之后重新检测,这样也许会让错误数量爆减。
2.使用浮动功能时记得适当清除指令
浮动是个危险的功能,未必会产生您所期望的结果。如果您遇到浮动元素延伸到外围容器的边框或者其他不正常情况,请先确定您的做法是正确的。请参阅Eric Meyer 在Complex Spiral Consulting Web 网站上的教学。
3.边界重合时利用padding或border来避免
您可能会为了一点不应该出现的空间而焦头烂额,或者您需要一点点空间时,怎样都挤不出来。如果您有用到margin,那么很容易产生边界的重合;Andy Budd在他的网站上解释了可能的做法。
4.尝试避免同时对元素指定padding/border以及高度或宽度
Windows版IE经常导致width与height的计算问题。有些方法可以解决此问题,但如果母元素需要指定高度与宽度时,最好能够在母元素之内的子元素套用margin,或者当子元素需要指定高度与宽度时,在母元素套用padding以达效果。
5.不要依赖min-width/min-height
Windows版IE并不支援两种语法。但是在某种程度下,windows版IE可以达到相当于min-width/min-height的效果,所以只要对IE做点过滤功能,即可达到您想要的结果。
6.若有疑问,先减少百分比
有时候某些错误会使50%+50%成为100.1%,使网页出现问题。这时请尝试将这些值改为49%,甚至49.9%。
7.记住“TRouBLed”写法
Border,margin与padding的简写语法有特定顺序,从上方开始顺时针方向转动:top,right,bottom,left. 所以margin:0 1px 3px 5px;的结果是上方无边界,右边1像素,以此类推。记住“TRouBLe”,您就不会弄错次序了。
8.只要不是零的值,都要指定单位
CSS需要您对每个font,Margin等各种值指定单位。(唯一的例外是line-height)
猜你喜欢
- 引用:Art Kulakov 《How to Build a Python Interpreter Inside ChatGPT》这个灵感来
- 把函数作为参数的用法比较直观:def func(a, b): return a + bdef test(f, a, b): print f
- 考虑以下python程序:#!/usr/bin/env pythonimport syssys.stdout.write("std
- pandas获取groupby分组里最大值所在的行方法如下面这个DataFrame,按照Mt分组,取出Count最大的那行import pa
- 1.从官网下载mysql-5.7.21-windowx64.zip mysql下载页面2.解压到合适的位置(E:\mysql) 这名字是我改
- MaxDB和MySQL是独立的数据库管理服务器。系统间的协同性是可能的,通过相应的方式,系统能够彼此交换数据。要想在MaxDB和MySQL之
- 一个小代码 类似资源管理器效果 支持鼠标拖拽 没写些细节东西 JavaScript语言:
- 本文实例讲述了微信小程序picker组件简单用法。分享给大家供大家参考,具体如下:picker滚动选择器,现支持三种选择器,通过mode来区
- 要知道我们程序猿也是需要浪漫的,小博我之前在网上搜寻了很多代码,确发现好多都不是最新的,所以自己就整理了一下代码,现在与广大博友们分享下我们
- 这两天看了下某位大神的github,知道他对算法比较感兴趣,看了其中的一个计算数字的步数算法,感觉这个有点意思,所以就自己实现了一个。算法描
- 有的时候,我们为了保持网页的美观,需要将较长的文字在一定长度时截断。比如我们希望在列表中显示文章标题的前15个字,那么一个这样的标题:“rs
- 场景描述今天在将 Hive 表同步到 MySQL 之后,其中有一列是唯一列,但是在 MySQL 中查询的时候 count 与 distinc
- 一些小技巧1. 如何查出效率低的语句?在MySQL下,在启动参数中设置 --log-slow-queries=[文件名],就可以在指定的日志
- 我们可以通过打开流并写入和读取 HTTP 请求和响应来使用 asyncio 查询网站的 HTTP 状态。然后我们可以使用 asyncio 并
- 最近项目中用到celery很多,Django快速接入celery,这里给份教程。准备pip安装celery、flower、eventlet快
- 问题说明最近在写爬虫,由于单个账号访问频率太高会被封,所以需要在爬虫执行一段时间间隔后自己循环切换账号所以就在想,有没有像单片机那样子设置一
- 一、Golang 错误是什么?对于Go语言(Golang)的错误是通过返回值的方式,来强迫调用者对错误进行处理,要么你通过 _ 忽略,要么你
- 本文要介绍的爬虫是抓取暴走漫画上的GIF趣图,方便离线观看。爬虫用的是python3.3开发的,主要用到了urllib、request和Be
- 在MySQL数据库中导出整个数据库:1.导出整个数据库mysqldump -u 用户名 -p 数据库名 > 导出的文件名mysqldu
- 在使用FCKeditor的时候,可能会碰到以下这个问题,就是在编辑器页面出错,提示为:找不到页面/fckeditor/editor/fcke