一、水平居中
<body>
<div id="wrapper">
...
</div>
</body>>
body {
text-align: center;
min-width: 800px;
)
#wrapper {
margin: 0 auto;
width: 800px;
text-align: left;
}
二、要随时清除浮动元素
1.用空标签清除
.clear {clear: both;}
<div id="layout">
<div id="left">Left</div>
<div id="right">Right</div>
<p class="clear"></p>
</div>
2.使用 overflow 属性
#layout { overflow: hidden; zoom: 1; }
<div id="layout">
<div id="left">Left</div>
<div id="right">Right</div>
</div>
3.使用 clearfix
.clearfix:before,
.clearfix:after {
content: ".";
display: block;
height: 0;
overflow: hidden;
}
.clearfix:after {clear: both;}
.clearfix {zoom: 1;} /* IE < 8 */
三、去掉图片下边出现的多余空白
1.将图片转换为块级对象
.pic img {display: block;}
2.设置图片的垂直对齐方式
img {vertical-align: top;}
3.改变父对象的属性
如果父对象的宽、高固定，图片大小随父对象而定，那么可以设置：
.pic {
width: 88px;
height: 31px;
overflow:hidden;
}
4.设置图片的浮动属性
.pic img {float: left;}
如果要实现图文混排，这种方法是很好的选择。
四、在IE下移除textarea的滚动条
textarea {overflow: auto;}
五、去除虚线轮廓
a, a:active { outline: none; }
- 大小: 6.4 KB
分享到：
相关推荐
这个名为“CSS Tips 合集.zip”的开源项目，显然是一份集合了各种实用CSS技巧和窍门的资源，旨在帮助开发者提升其CSS技能，更好地进行网页设计与布局。 1. **CSS基础知识**：了解CSS的基本语法，如选择器（类选择器...
javaeye的信息提示框代码之css tips.css
"纯CSS实现tips帮助提示框代码"是一个专为网页开发者设计的资源，它允许你创建交互式的提示框，无需依赖JavaScript，只用CSS就能实现。这在优化页面加载速度和降低复杂性方面具有显著优势。 首先，我们要理解CSS...
css-protips, 帮助你掌握CSS技巧的技巧集合 CSS Protips 帮助你掌握CSS技巧的技巧集合。对于其他优秀列表，请查看 @sindresorhus curated curated列表awesome列表。 table-内容Protips支持插件翻译工具
CSS 技巧您好，我正在编译我使用过并有经验的 css 技巧。 我认为手头有它会很好，尽管它不是非常极端的信息。速记它使我们免于进行不必要的定义，并允许我们在一行中完成我们的工作。 它使我们的 CSS 代码更有条理和...
在现代网页设计中，提示框（Tips）是必不可少的组件之一，它能够为用户提供额外的信息，增强用户体验。在构建提示框时，纯CSS技术因其轻量级和快速渲染的特点而被广泛使用。本文将介绍三种使用纯CSS技术实现提示框的...
在CSS世界中，创建独特的视觉效果常常需要巧妙的技巧和对特性的深入理解。本文将探讨如何使用CSS实现段落每行渐变色文本效果，这不仅为网页设计增加了动态感，也为阅读体验增添了趣味性。 首先，让我们回顾一下基本...
CSS Protips 帮助你提高CSS技能专业的技巧集合
firefox下没有问题，IE下显示不正常，CSS厉害的可以修改一下。
用纯的css实现div层的隐藏与显示，当鼠标经过某一区域或者Div 或者按钮时隐藏层显示，鼠标离开隐藏层隐藏。
### CSS Anthology: 101 Essential Tips, Tricks & Hacks (2009) — 知识点解析 #### 一、概述 《CSS Anthology: 101 Essential Tips, Tricks & Hacks》是一本由SitePoint Pty Ltd于2009年出版的专业CSS书籍，作者...
《CSS Protips：掌握CSS技能的实用指南》 在网页设计和开发领域，CSS（Cascading Style Sheets）是不可或缺的一部分。它赋予HTML元素样式，让网页呈现出丰富多彩、交互性强的视觉效果。为了帮助开发者更好地掌握CSS...
在IT行业中，CSS3是网页设计的关键技术之一，它极大地扩展了CSS2的功能，使得网页的样式和交互性有了更大的提升。在这个名为“css3神奇tooltips提示框动画”的项目中，开发者利用CSS3的特性，创造了一系列引人注目的...
react-functional-css-protips, 功能CSS好，坏，一些Protips用于 React.js 用户 功能 CSS - 好的，坏的，和一些用于 React.js 用户 更新( Jun，2017年)我用mid-2016写这篇文章。 自那时以来，更多的图书馆。 对于 ...
The CSS Anthology: 101 Essential Tips, Tricks & Hacks is a compilation of best practice solutions to the most challenging CSS problems. The third edition of this best-selling book, published in full ...
以最少的努力获得 CSS 工具提示！ ＃＃例子 <a></a> 工具提示不应该很复杂，它们不应该做超过绝对必要的事情。 如果您的工具提示需要做的不仅仅是提供一小段信息，那么请考虑您的设计或考虑使用诸如 popover 组件...