css3 tools |css inch

1. CSS3 Generator

/* CSS3 Generator */
.box {
box-shadow: 10px 10px 5px #888888;
border-radius: 10px;
transform: rotate(30deg);
}

CSS3 Generator是一个在线的CSS3样式生成器，它可以轻松帮助你生成想要的CSS3样式。

2. Sass

/* Sass示例 */
$message-color: #3bbfce;
$message-border-color: lighten($message-color, 30%);
.message {
border: 1px solid $message-border-color;
color: $message-color;
}

Sass是一种流行的CSS预处理器，它可以让你编写更好的CSS代码，并且可以轻松地完成样式的扩展、管理和维护。

3. Compass

/* Compass示例 */
@import "compass/css3";
.box {
@include border-radius(10px);
@include transform(rotate(30deg));
}

Compass是基于Sass的CSS框架，它提供了丰富的CSS3工具和Mixin，可以帮助你更快速地编写CSS3代码。

4. Modernizr

/* Modernizr示例 */
if (Modernizr.borderimage) {
$('.box').css('border-image-source', 'url(border.png)');
}

Modernizr是一个JavaScript库，它可以在浏览器中检查CSS3和HTML5功能是否可用，并有相应处理。

5. Prefixr

/* Prefixr示例 */
.box {
box-shadow: 10px 10px 5px #888888;
border-radius: 10px;
transform: rotate(30deg);
}

Prefixr是一个在线的CSS3前缀生成器，可以帮助你自动生成适用于不同浏览器的CSS3前缀。

CSS3工具的出现，为CSS3设计师提供了更好的协作和开发体验，让CSS3设计更加容易、高效。