玩转IE页面元素随意改
很多时候我们对一些我们常去网站的页面布局并不满意，比如某些网站的功能我们可能并不需要，但却被放到了主页碍眼的部位，或者某些页面上的广告过多导致我们获取信息变得非常麻烦。当然某些第三方的浏览器可能可以透过插件来改变网页上的这些元素，但如果我们使用的是IE浏览器我们通过浏览器内置的一个“用户样式表”功能即可轻松的实现这个功能。这里我将详细介绍如何编写样式表并使用这个功能修改网页元素。什么是样式表 首先我们先了解一下什么是样式表：样式表是一种可以控制整个网页显示方式的文件，随着HTML标准化的发展进程，样式表以优异的性能逐渐取代了内联样式被开发者大量使用。在这里我们所要用到的样式表文件被称作Cascading Style Sheets（层叠样式表单）简称CSS，通过它我们可以修改绝大多数的网站元素，实现用我们的习惯对网页进行修改。如何创建样式表 CSS文件采用了纯文本的格式，我们可以用任意的编辑软件创建这类文件。其标准格式如下： 元素选择器
{
属性:值;
属性:值;
} 元素选择器常用的有2种，以 . 开头的Class选择器和以 #开头的ID选择器，属性如果我们想让一个页面上的广告消失可以用display这个属性。
下面我们用这个方法修改一下人人网的主页，取消里面的好友推荐模块：首先我们用IE打开人人网，之后按F12键调出网页调试工具，用里面的元素选择按钮来选择到推荐这个层。
http://lh3.ggpht.com/-ozfuhyQZf5s/T66B9wQtJ_I/AAAAAAAAAMU/H3spQCOP1o8/image_thumb%25255B2%25255D.png?imgmax=800
这里我们可以看到这个层的class为side-item pymk pymk-home和ID为pymk_home，对于这种ID和Class都被定义过的层我们尽量使用ID选择器，因为ID对于一个页面来讲具有惟一性，可以准确选择到我们所需要的层。
所以我们的CSS文件可以这样写：
#pymk_home
{
display:none !important;
}
当然你也可以使用Class选择器：
.side-item pymk pymk-home
{
display:none !important;
}
当display属性的值设置为none的时候这个页面元素将不会被显示，!important代表如果这个元素的display值也被其他样式表定义过那么优先使用现在定义。这样定义之后好友推荐模块将被彻底隐藏，如果在某些网站使用这种方法隐藏页面元素造成了版面错乱的话我们也可以用visibility:hidden这条语句，visibility和display的区别在于只是让模块变为不可见，但对应的位置予以保留。
http://lh6.ggpht.com/-HlaAdWkS4K8/T66B_2HANeI/AAAAAAAAAMc/8FLz1Oo-yk0/image_thumb%25255B6%25255D.png?imgmax=800 http://lh6.ggpht.com/-hX0JPVnFwYk/T66CCBHziRI/AAAAAAAAAMk/iUOaa3noDhk/image_thumb%25255B7%25255D.png?imgmax=800（左图为display:none的效果，右图为visibility:hidden的效果）当然除了隐藏模块层之外，我们也可以利用CSS改变文字大小颜色，移动模块位置等，关于CSS的更多用法大家可以参考 W3 School 上的相关教程在这里就不做过多的叙述了。如何应用样式表我们在创建CSS文件之后将其保存到硬盘的任意位置，比如F:\restyle.css , 然后打开Internet选项，点击辅助功能，选中使用样式表编排文档格式，在下面输入框中填入我们保存文件的地址的F:\restyle.css。确定退出即可，然后我们再次访问相关网页时页面就会按我们的定义来显示了。
http://lh5.ggpht.com/-PJ0duPJKXoc/T66CG_FXPpI/AAAAAAAAAMA/qs16QHlt9yE/image_thumb%25255B25%25255D.png?imgmax=800
原帖地址：http://www.veware.com/2012/05/ie.html#more
不错。chrome的样式表玩的差不多了，回头在IE10上试试水。 牛人哦！！！
页:
[1]