网页设计中的默认字体样式详解
浏览器默认的样式往往在不同的浏览器、不同的语言版本甚至不同的系统版本都有不同的设置，这就导致如 果直接利用默认样式的页面在各个浏览器下显示非常不一致，于是就有了类似YUI的reset之类用来尽量重写浏览器的默认设置保证各个浏览器样式一致性的做法。 拿字体来说，各个浏览器默认的字体种类、字体大小和字体行高都不一样，比如IE8的中文版在Wind...
阅读更多精通CSS-1: 常用设计元素的高级CSS技巧
提升CSS技巧往往并不需要你去创造出什么前无古人后无来者的CSS技巧，事实上，网页设计中常用的一些布局和样式技巧，每个学CSS的人都已经知道怎么实现了，但我们总是想寻找更佳的解决方案。 本文收集整理了60多个高级CSS技巧，不管你是CSS新手还是高手，相信这些技巧都能助你更进一步提高自己的CSS技能。 1. CSS布局和用户界面技巧 当前 CSS 主要应用...
阅读更多18个CSS精简压缩工具和技巧
我们已看过8个在线CSS优化工具和CSS代码精简技巧，本文则为你带来18个CSS精简压缩工具和技巧。 压缩还是不压缩 在我们讨论如何压缩CSS之前，需要注意一下在压缩和代码的易读性上常常要有个平衡。很多编码者以其CSS组织清晰为傲，而且并不希望自己的代码被 通过压缩器去掉注释和断行。作为一个设计师，你应该分析你所编写的代码的目标。如果你要创建一...
阅读更多CSS Overflow属性详解
检索或设置当对象的内容超过其指定高度及宽度时如何管理内容。 所有对象的默认值是 visible ，除了 textarea 对象和 body 对象的默认值是 auto 。设置 textarea 对象此属性值为 hidden 将隐藏其滚动条。 overflow属性有四个值：visible (默认), hidden, scroll, 和auto。同样有两个overflow的姐妹属性overflow-y 和overflow-x，它们很少被采用。 Visi...
阅读更多8个CSS图表数据制作实例
有很多方法可以用来呈现数字, 我们最常用的就是制作一张静态图片. 但你也可以考虑CSS。使用CSS样式化元素来实现数据图表化. 可以使数据的控制更具灵活性。 下面. 你将看到8个CSS技巧. 教你如何使用CSS来制作漂亮、灵活的图表。 1. CSS线条图表数据 这个实例包含了三种图形数据的实现方法。上面的Basic Bar Graph实例中使用了一个<div>包含图表....
阅读更多CSS背景属性Background详解
本文详解了CSS的背景属性Background，包括CSS3中新增的背景属性。如果你是个CSS初学者，还可以查看之前介绍的CSS浮动属性和CSS透明属性详解。 css2 中的背景(background) CSS2 中有5个主要的背景(background)属性，它们是： background-color: 指定填充背景的颜色。 background-image: 引用图片作为背景。 background-position: 指定元素背景图片的位...
阅读更多21个神奇的CSS技巧
CSS有无穷的发挥力。继53个CSS技巧后，让我们再来欣赏21个更加高阶更加神奇的CSS技巧，它们可以让你实现一些非常酷的网页效果。需要提醒的是，这些技巧并不一定都适合使用，但却有助你对CSS的运用更加娴熟。 1. 跨浏览器的CSS幻灯片 2. 基于CSS的图像地图 3. 纯CSS的LightBox灯箱效果 4. CSS图片替换技术制作的按钮 5. 使用CSS实现的动画导航菜单...
阅读更多CSS定位属性Position详解
CSS中最常用的布局类属性，一个是Float(CSS浮动属性Float详解)，另一个就是CSS定位属性Position。 1. position:static 所有元素的默认定位都是：position:static，这意味着元素没有被定位，而且在文档中出现在它应该在的位置。 一般来说，不用指定 position:static，除非想要覆盖之前设置的定位。 #div-1 { position:static; } 2. position:relativ...
阅读更多CSS浮动属性Float详解
什么是CSS Float？ float 是 css 的定位属性。在传统的印刷布局中，文本可以按照需要围绕图片。一般把这种方式称为“文本环绕”。在网页设计中，应用了CSS的float属性的页面元素就像在印刷布局里面的被文字包围的图片一样。浮动的元素仍然是网页流的一部分。这与使用绝对 定位的页面元素相比是一个明显的不同。绝对定位的页面元素被从网页流里面移除了...
阅读更多
