Posts Tagged ‘ clear ’

用Dust-Me Selectors清理CSS文件

现在减少文件大小是前端的一项重要任务，对于js和css文件可以用软件去除里面的注释和空格来达到减少体积的目的。但是css文件还是有很多无用的代码，可以用Dust-Me Selectors来得到无用代码的名单，然后就可以按图索骥来清除它们。

  • 支持外链形式的样式表，如使用<link>和@import外联到页面中的样式表，还包括<?xml-stylesheet?>处理结构里带的样式表。但是对于嵌入样式（在标签<style>内的样式）和内联（使用元素的style属性的行样式）的样式，是不支持的。
  • 支持IE条件注释语句。
  • 即可以检查单页，也可以检查整个站点。
  • 可以识别大部分的CSS2和CSS3选择器，但可以识别所有的CSS1选择器。
  • 可以识别一般的CSShack，如：“* html #foo”会被当成“html #foo”。

Dust-Me Selectors

Dust-Me Selectors

2010
07/13
分类：
前端
TAGS

抢沙发

自动清除浮动

在做网页时经常会碰到元素的自动清除浮动问题，现记下两种解决方法。设有网页元素如下：

<div class="container">
	<div class="left">
        左浮动元素<br />
        左浮动元素<br />
        左浮动元素<br />
        左浮动元素<br />
        左浮动元素<br />
        左浮动元素<br />
        左浮动元素<br />
    </div>
    <div class="right">
        右浮动元素<br />
        右浮动元素<br />
        右浮动元素<br />
        右浮动元素<br />
        右浮动元素<br />
        右浮动元素<br />
        右浮动元素<br />
	</div>
</div>

若要class值为“container”中的两个元素分别左右浮动，则需以下CSS代码：

div.container{
    width:100%;
    background:#ff9;
}
div.left{
    width: 45%;
    float: left;
}
div.right {
    width: 45%;
    float: right;
}

常用清除浮动的CSS代码如下：

阅读全文

2009
12/27
分类：
前端
TAGS



抢沙发