原创分享--如何用google chrome实现简单的CSS即时变换网页样式的效果

GOOGLE的东西就是好用。最的有一些同学说不懂CSS，不知道怎么调效果，其实呢，对于我们外贸建站者来讲不需要太懂CSS,但又是必不可少，今天就讲下CHROME怎么实现简单的CSS 即时变换网站样式。

PS:关于本文中提到的 CSS,DIV，元素等概念不懂的同学请参考 http://www.w3school.com.cn/

本文实例以IMIKER官网为例（MRHUA看到不会骂我吧，哈哈）

工具：GOOGLGE CHROME 浏览器

1.打开IMIKER网站，并在米课LOGO上面单击右键，选择审查元素

[attach]2140[/attach]

2. 然后就会出现编辑面板，下左侧为网站源代码（经过编译的），下右侧为CSS代码

[attach]2141[/attach]

3. 如果把鼠标放在左侧DIV或者元素上面，那上部分网页的相对应的部分就出加上阴影，提示你编辑的对象是哪部分

[attach]2142[/attach]

4. 如果把鼠标放在BOGY元素上面，那整个版面就加上阴影

[attach]2143[/attach]

5. 现在我们把鼠标放在LOGO对应的元素上面并单击，右侧就会显示控制此元素的CSS代码

[attach]2145[/attach]

6.对于右侧的CSS, 正常显示的部分为实际产生效果的CSS，加了中划线的为不产生效果的CSS

[attach]2146[/attach]

7. 选择其中一个CSS进行修改，单击CSS 的值，就变成可编辑的状态

[attach]2147[/attach]

8. 把这个值改成100PX，看上面！米课LOGO的位置马上变了

[attach]2148[/attach]

怎么样，好玩吧？

当你在修改网站的样式的时候，可以用些方法先进行简单的调式，当达到你满意的效果时，记下修改的CSS，转到WP后台对CSS进行修改并保存，可以实现你想要的效果。

QUESTION: 是不是米课的网站就这样活生生被你篡改了？

ANSWER：怎么可能，这只是一个效果而已，你改了下效果后，再刷新你的网站，即可变成原来的模样，别怕！

怎么样，学会了吗？SO EASY! 现在就去改IMIKER的网站试试吧！

鸣谢： MRHUA 创造了米课和米问给大家提供了一个学习和交流的平台

LIAOSAM帮了我很多忙，这一招可以说是跟LIAOSAM学的。