CSS 几条经典的 CSS Tips
作者:grace 来源:gracecode.com 发布时间:2008-08-20 18:40:00
标签:css,浮动,链接,滚动
MacJi “偷懒”翻译了部分,下午冒着被 BOSS 开除的危险将其补完(原文链接)。
使用 line-height 垂直居中
line-height:24px;
使用固定宽度的容器并且需要一行垂直居中时,使用 line-height 即可(高度与父层容器一致),更多的垂直居中总结可以看这里。
清除容器浮动
#main { overflow:hidden; }
期前也提到过这样的问题,更多信息可以看这里。
不让链接折行
a { white-space:nowrap; }
上面的设定就能避免链接折行,不过个人建议长链接会有相应的这行(有关换行方面的讨论,参看圆心的记录)。
始终让 Firefox 显示滚动条
html { overflow:-moz-scrollbars-vertical; }
更多的 Mozilla/Firefox 私有 CSS 属性可以参考这里。需跨浏览器的支持,也可以使用
body, html { min-height:101%; }
使块元素水平居中
margin:0 auto;
其实就是
margin-left: auto; margin-right: auto;
这个技巧基本上所有的 CSS 教科书都会有说明,别忘记给它加上个宽度。Exploer 下也可以使用
body{ text-align: center; }
然后定义内层容器
text-align: left;
恢复。
隐藏 Exploer textarea 的滚动条
textarea { overflow:auto; }
Exploer 默认情况下 textarea 会有垂直滚动条(不要问我为什么)。
设置打印分页
h2 { page-break-before:always; }
page-break-before 属性能设置打印网页时的分页。
删除链接上的虚线框
a:active, a:focus { outline:none; }
Firefox 默认会在链接获得焦点(或者点击时)加上条虚线框,使用上面的属性可以删除。
最简单的 CSS 重置
* { margin: 0; padding: 0 }
如果想“复杂”,参考YUI 的做法(还有这里)。原文留言中也有用户说了他们的观点
I have to agree with Niall Doherty, * {margin: 0px; padding: 0px;} basically means "traverse every css element and give it these attributes". That is a very unnecessary strain on the server and a bad semantic practice, as you have to give some elements padding/margin again, after stripping them.


猜你喜欢
- 前几天在把一个Communtiy Server 的数据库从SQL 2000升级到SQL 2005&n
- pandas中对DataFrame筛选数据的方法有很多的,以后会后续进行补充,这里只整理遇到错误的情况。1.使用布尔型DataFrame对数
- #!/usr/bin/env python# -*- coding:utf-8 -*-"""老规矩以下方法环境
- 导言:当向类型化的数据集(Typed DataSet)添加一个TableAdapter时,相应的DataTable的构架已经由TableAd
- BP算法是适用于多层神经网络的一种算法,它是建立在梯度下降法的基础上的。本文着重推导怎样利用梯度下降法来minimise Loss Func
- 本文分析了CodeIgniter连贯操作的底层原理。分享给大家供大家参考,具体如下:php oop连贯操作原理->符号其实是传递对象指
- 本文实例讲述了Python正则替换字符串函数re.sub用法。分享给大家供大家参考,具体如下:python re.sub属于python正则
- 1.CNN卷积层通过nn.Conv2d可以设置卷积层,当然也有1d和3d。卷积层设置完毕,将设置好的输入数据,传给layer(),即可完成一
- 问题描述有些小伙伴在使用python做GUI界面的时候可能想添加这么一个小功能,就是在界面的某个角落动态的显示当前的时间,本文将介绍具体方法
- 本文实例讲述了Python实现备份MySQL数据库的方法。分享给大家供大家参考,具体如下:#!/usr/bin/env python# -*
- 目录一、比较汽车性能二、比较不同城市近期天气状况雷达图是以从同一点开始的轴上表示的三个或更多个定量变量的二维图表的形式显示多变量数据的图形方
- 前言 一直用ASP+ACCESS来编写网页和公司的内部应用系统,内部应用系统也就是大家说的OA吧,这个我也不知道,公司又叫它ERP,反正不管
- 利用sklearn画出决策树并保存为PDF下载Graphviz进入官网下载并安装:https://graphviz.gitlab.io/_p
- # django manage.py扩展自定义命令环境: mac django1.10.3在实际的项目开发过程中,我们可能要执行某脚本初始化
- 本文讲述了Java数据类型与MySql数据类型对照表。分享给大家供大家参考,具体如下:类型名称显示长度数据库类型JAVA类型JDBC类型索引
- 基本介绍break语句用于终止某个语句块的执行,用于中断当前for循环或跳出switch语句基本语法{..........break....
- 一、什么是系统调用In computing, a system call is the programmatic way in which
- 如何结束Python的子线程和子进程结束子线程的方法:这个是搬运其他大神的代码,鄙人也不知道原理,反正拿来主义,暂时没发现什么缺点,先用着再
- 本文实例讲述了Python基于FTP模块实现ftp文件上传操作。分享给大家供大家参考,具体如下:#!/usr/bin/python#-*-
- 并查集是一种树型的数据结构,用于处理一些不相交集合的合并及查询问题。常常在使用中以森林来表示。并查集有三种基本操作,获得根节点,判断两节点是