工具箱的CSS

工具箱的CSS是什么？

工具箱CSS是样式信息，没有任何独特的是与任何特定的网站。 这是一种可以在任何网页上项目的收集有用的共同风格。 有多少次你写的结算1浮动一类？ 太多了，是我的猜想。 用工具箱的CSS的想法是，包括为这些“工具单独的样式表”的样式。

什么不是工具箱的CSS？

工具箱的CSS并不是的CSS重置。 工具箱的CSS并不是的CSS框架。 工具箱包含的CSS样式没有“灵魂”，使得任何网络项目独一无二的。

为什么要使用工具箱的CSS？

使用工具箱的CSS将节省您的时间。 这样可以节省从写同一款式反覆着你。 需要浮动到左的东西？ 您随时可以指望你的工具箱。 它还可以帮助您保持您的网站之间的一致性。 如果你总是使用相同的工具箱中，您的标记将共享相同的通用类名和使您更轻松地跳进和理解回来。

该守则

为工具箱的CSS代码如下。 或者，使用直接联系 。

/* Toolbox CSS Chris Coyier http://css-tricks.com */ /* LAYOUT TOOLS */ .floatLeft    { float: left; } .floatRight   { float: right; } .clear    { clear: both; } .layoutCenter   { margin: 0 auto; } .textCenter   { text-align: center; } .textRight   { text-align: right; } .textLeft   { text-align: left; } /* PRINT TOOLS */ .page-break    { page-break-before: always; } /* TYPOGRAPHIC TOOLS */ .error    { border: 1px solid #fb4343; padding: 3px; color: #fb4343; } .warning   { border: 1px solid #d4ac0a; padding: 3px; color: #d4ac0a; } .success   { border: 1px solid #149b0d; padding: 3px; color: #149b0d; } .callOut   { font-size: 125%; font-weight: bold; } .strikeOut   { text-decoration: line-through; } .underline   { text-decoration: underline; } .resetTypeStyle   { font-weight: normal; font-style: normal; font-size: 100%; text-decoration: none; background-color: none; word-spacing: normal; letter-spacing: 0px; text-transform: none; text-indent: 0px; } /* STYLING EXTRAS */ a[href^="mailto"]  { background: url(images/emailIcon.png) left center no-repeat; padding-left: 10px; } a[href~=".pdf"]   { background: url(images/pdfIcon.png) left center no-repeat; padding-left: 10px; } a.button   { color: black; border: 1px solid black; padding: 3px; } a.button:hover  { background: black; color: white; } .transpBlack   { background: url(images/transpBlack.png); } /* DISPLAY VALUES */ .hide    { display: none; } .show    { display: block; } .invisible   { visibility: hidden; } 

一点解释

分页符 ：通过插入“页面，打破”阶级，新的一页时，将启动该网站打印到打印机。 实用大图像之前或主要部分。

造型演员 ：这些参考的图像文件的情侣，我这里不包括。 有许多许多地方为你找到不错的图标，试图查找图标 。

显示值 ：有一个显示器之间的区别：没有，能见度：隐藏。 设置显示值都不会删除页面布局中，造成回流。 有时需要，有时没有。 如果你只想隐藏一个元素，但离开它占领的空间，完整，使用可见性属性。