我想网

CSS（层叠样式表）是一种简单的设计语言，能够将页面变漂亮这回事儿变的简单化。在HTML和XHTML中设定页面的样式，这是最常用的应用。但 也可以应用于 XML类的文档，包括SVG和XUL。他负责管理网页的设计和外观。使用CSS，你可以控制文字的颜色、字体、段落间距、分栏的数目大小布局、背景图片颜 色，以及其他很多种的效果。接下来才是要说的是学习并掌握CSS的20个绝佳站点。这里收集到的CSS站点能使你从初学者到高级人员。这些能协助你开发和 改进网站。恩，随便看看吧。
Csstutorial

这个站点全部是关于CSS的。万一你不熟悉CSS：CSS是HTML的一种姐妹技术，可以设计你的页面。这些细节都在教程里面，不过现在我就可以说Css 可以让你页面看起来更好！
Visit Site
cssbasics
(全文 …)

Tags: CSS, Website
Posted in CSS, Website 评论关闭

有越来越多的人使用CSS3作出了非常酷的实验，以下是一些例子，从下面的这些按钮上你可以看出CSS3的强大，它真得没有使用任何图片，完全用CSS样式实现，非常之神奇，别的就不多说了，看内容吧。

1. Sweet CSS3 Buttons

我非常喜欢这些可爱的按钮，它们看起来确实非常漂亮！
(全文 …)

Tags: CSS, CSS3
Posted in CSS 评论关闭

在当今网页设计/开发实践中，使用CSS来为语义化的(X)HTML标记添加样式风格是重要的关键。在设计师们的梦想中都存在着这样的一个完美世 界:所有的浏览器都能够理解和适用多有CSS规则，并且呈现相同的视觉效果(没有兼容性问题)。但是，我们并没有生活在这个完美的世界，现实中发生的失窃 却总是恰恰相反，很多CSS样式在不同的浏览器中有着不同的解释和呈现。

当今流行的浏览器(如:Firefox、Opera、Internet Explorer、Chrome、Safari等等)中，有一些都是以自己的方式去理解CSS规范，这就会导致有的浏览器对CSS的解释与设计师的CSS 定义初衷相冲突，使得网页的样子在某些浏览器下能正确按照设计师的想法显示，但有些浏览器却并没有按照设计师想要的样子显示出来，这就导致浏览器的兼容性 问题。更糟的是，有的浏览器完全无视CSS的一些声明和属性。

正因为上述冲突和问题依然存在于这个”不完美的世界”，所以一些设计师想到了一种避免浏览器兼容性问题的方法，那就是CSS Reset，什么是CSS Reset？我们可以把它叫做CSS重设，也有人叫做CSS复位、默认CSS、CSS重置等。CSS重设就是由于各种浏览器解释CSS样式的初始值有所不 同，导致设计师在没有定义某个CSS属性时，不同的浏览器会按照自己的默认值来为没有定义的样式赋值，所以我们要先定义好一些CSS样式，来让所有浏览器 都按照同样的规则解释CSS，这样就能避免发生这种问题。
(全文 …)

Tags: CSS
Posted in CSS 评论关闭

CSS的命名我使用过很多种方式：

• 用功能名的拼音。感觉很二，也很长，写多了很快就不明白是什么了，因为我拼音也用得不多，打字一直用五笔，写多了就无法很快了解当前样式的意思。
• 用功能名的对应英文词组组合。到是不会让自己感觉很二，但我自己的英文菜得无法言语，所以在写CSS时常常开着google的翻译网页，呵呵，不怕各位笑话。
• 基于CSS属性命名些常用的样式。这是在我写CSS一段时间后慢慢形成的习惯，因为记忆方便，不用写个样式就去想下应该命名成什么。如果有独特需 求也只需联合父层就可以进行独特需求的设置了。在我看来这种写法是将CSS属性进行最小单元封装的过程，但这样做也不是没有问题，后面会说到。

但我却从来没有总结过，惭愧啊~~
(全文 …)

Posted in CSS 评论关闭

今天要和大家一起分享的是用CSS3来制作的图片画廊，效果很好，可以用在项目中，不过不同的浏览器对这些示例的支持是不一样的，见意用高版本的啊。

Polaroid from Tutorialzine

(全文 …)

Tags: CSS, CSS3, Gallery
Posted in CSS 评论关闭

例如：设置图片最大高度和宽度分别为120px，75px，即当图片宽大于120或者高大于75时则等比例缩放。

Tags: CSS, Source-code
Posted in CSS, 程序源码 评论关闭

速查表是帮你记住东西的有效工具。Web设计师和开发者经常使用的快捷键简表会使他们在网上的工作效率大大提高。

事实上，速查表就是来帮助我们把日常中最常用到的信息聚集起来，方便使用，使我们做工作时更有效率。有了它们，免去了你的大脑花额外时间去记忆它们的烦恼——你只需要打开简表，马上能查到你想要的信息。

这篇文章里，你可以看到最实用的HTML，CSS，JavaScript速查表，它们可以当作参考资料，备忘录，能帮助你以最快的速度找到想要的信息。

看看这些简表是不是你想要的，请在文章下面留下你的建议，谢谢！

HTML

HTML帮助手册

(全文 …)

Tags: Cheat-Sheets, CSS, HTML, JavaScript
Posted in CSS, HTML, JavaScript 1 条留言 »

CSS学起来并不难，但在大型项目中，就变得难以管理，特别是不同的人在CSS书写风格上稍有不同，团队上就更加难以沟通，为此总结了 一些如何实现高效整洁的CSS代码原则：

1. 使用Reset但并非全局Reset

不同浏览器元素的默认属性有所不同，使用Reset可重置浏览器元素的一些默认属性，以达到浏览器的兼容。但需要注意的是，请不要使用全局 Reset：


*{ margin:0; padding:0; }


这不仅仅因为它是缓慢和低效率的方法，而且还会导致一些不必要的元素也重置了外边距和内边距。在此建议参考YUI Reset和Eric Meyer的 做法。我跟Eric Meyer的观点相同，Reset并不是一成不变的，具体还需要根据项目的不同需求做适当的修改，以达到浏览器的兼容和操作上的便利性。我使用的 Reset如下:
(全文 …)

Tags: CSS
Posted in CSS 评论关闭

近年来，CSS不透明算得上是一种相当流行的技术，但在跨浏览器支持上，对于开发者来说，可以说是一件令人头疼的事情。目前还没有一个通用方法，以 确保透明度设置可以在目前使用的所有浏览器上有效。

这篇汇总主要是提供一些CSS不透明的详细介绍，代码示例和解释，以实现这项有用的CSS技术在您的项目中兼容所有浏览器。

关于CSS 透明度，有一点需要注意的是，它虽然使用了很多年，但它一直以来都不是一个标准属性。它是一种非标准技术，应该是CSS3规范的一部分。

1. 旧的Opacity设置

以下代码是Firefox和Safari旧版本所需的透明度设置:

#myElement {-khtml-opacity: .5; -moz-opacity: 0.5;}

-khtml-opacity设置是针对旧版本的Webkit渲染引擎，这种专用属性现在已经过时了，除非你还有需要兼容Safari 1.x.的用户。

第二行使用专用属性 -moz-opacity是 为了兼容Mozilla渲染引擎的早期版本，以及追溯到Netscape Navigator。Firefox 0.9以后就不要求使用-moz-opacity属性，Firefox 3.5（现在使用Gecko引擎）已经不在支持这个属性。
(全文 …)

Tags: Browser, CSS
Posted in Browser, CSS 评论关闭

尽管被批评为走火入魔，CSS3 痴迷者们仍然在尝试实现各种基于纯 CSS 的图形与图标设计，如果你看到本文介绍的这些精美图标，你绝对不会相信它们完全是由 CSS3 代码生成的。尤其是那套由 Louis Harboe 设计的 iOS 图标，那么微妙的色彩与纹理，真的难以置信。

奥林匹克标志

作者: Doug Neiner
基于纯 CSS，以 em 为单位，可动态调整尺寸，需要浏览器支持 border-radius 属性，目前支持的浏览器包括 Chrome, Safari, Firefox 和 IE9。

(全文 …)

Tags: CSS, CSS3, Icon
Posted in CSS, Icon 评论关闭