Myeclipse 中提示css代码：
1、打开eclipse→Windows→Preferences→Java→Editor→Content Assist；修改Auto Activation triggers for java的值为：.abc 点击apply按钮；
2、继续打开JavaScript→Editor→Content Assist
3、修改Auto Activation triggers for javaScript的值为：.abc 点击apply按钮；
4、继续打开web→html Files→Editor→Content Assist
5、修改Prompt when these characters are inserted:的值为：.html 点击apply按钮；
6、设置完以上三步，点击"OK",按钮；然后打开File→Export→Genral→Preferences→Next→Browse文件到任意位置→文件保存类型epf→Finish；
7、然后用记事本或其它文本工具打开此文件 ，Ctrl+F查找 .abc 然后将其值改为 .abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVW；
8、再查找 .abc 然后将其值改为 .abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVW
9、再查找 .html 然后将其值改为 <=.abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVW。
10、修改完之后保存文件；
11、打开eclipse→File→Import→Genral→Preferences，导入刚刚编辑的文件后，所有设置完毕，现在去测试一下吧，以下是调试成功后的图片：
前言
这段时间一直在看Bootstrap，V3官方直接提供了Less版本的源码，就先将Less学完了，很简单的语法，学习写Demo都是在Webstorm里写的，配置了Watcher自动编译（详见《在WebStorm里配置watcher实现编辑less文件时自动生成.map和压缩后的.css文件》）。
随着学习的加深，开始接触Sass了，Bootstrap V3也提供了Sass的源码，而且V4官方就只提供Sass的源码，从侧面证明Sass的流行趋势，毕竟Sass功能更全面，因此笔者决定以后就使用Sass了（新版本叫Scss）。
开始动手
1、下载rubyinstaller-2.3.3-x64.exe 安装（从官网下载，注意，安装过程中下面的设置。
2、安装完成后用命令检查是否安装成功，成功会显示版本信息。
ruby -vgem -v12
3、安装Sass
gem install sass1
安装完后，C:\Ruby23-x64\bin里将有下面的文件。
4、Webstorm里添加Watcher
同Less类似，在工程里新建scss文件时会自动显示【Add Wather】,如果没有提示，也可以通过【文件(File)】-【设置(Settings)】-【工具(Tools)】-【File Watchers】-【+】-【SCSS】打开New Watcher配置界面。
默认值(默认生成css 和 css.map)
参数名
参数值(下面no和update前是两个”-“)
Program C:\Ruby23-x64\bin\scss.bat
Arguments –no-cache –update $FileName$:$FileNameWithoutExtension$.css
Output paths to refresh $FileNameWithoutExtension$.css
修改后（生成压缩后css）
参数名
参数值(下面no和update前是两个”-“)
Program C:\Ruby23-x64\bin\scss.bat
Arguments –no-cache –update -t compressed $FileName$:$FileNameWithoutExtension$.css
Output paths to refresh $FileNameWithoutExtension$.css
很简单，比Less还要简单。写一段scss代码试试。
补充：
参数值里，-t 后面可以配置的值
值
结果
nested 嵌套
expanded 展开
compact 每句一行
compressed 压缩
阅读全文
版权声明：本文为博主原创文章，未经博主允许不得转载。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><meta http-equiv="Content-Type" content="text/html charset=utf-8" />
<script src="jquery-1.7.2.min.js"></script>
<script>
$(function(){
$('#btn0').click(function(){
var width = document.body.clientWidth+'px'
var height = document.documentElement.clientHeight+'px'
var p = {
width:$('#msg').width(),
height:$('#msg').height()
}
var left = ($(window).width() - p.width) / 2 + 'px'
var top = ($(window).height() - p.height) / 2 + 'px'
$('#middle').css({'width':width,'height':height,'position':'fixed'}).show()
$('#msg').css({'left':left,'top':top}).show()
$('#output').hide()
$(this).hide()
})
$('#btn1').click(function(){
$('#ff').html($('#inp').val())
$('#inp').val('')
$('#output').show()
$('#btn0').show()
$('#middle,#msg').hide()
})
$('#btn2').click(function(){
$('#inp').val('')
$('#btn0').show()
$('#middle,#msg').hide()
})
})
</script>
<style type="text/css">
#middle{
filter: alpha(opacity=50)
opacity:0.5
-moz-opacity:0.5
z-index:3
background-color:#e4eaf3
}
#msg{
position:fixed
float: left
z-index:999
width:160px
border:2px solid #828d97
background-color:#e4eaf3
display:none
}
</style>
<div style="z-index:1float: left">
<button id="btn0">点击我输入内容</button><br />
<span id="output" style="display:none">输入的内容为：<font color="red" id="ff" /></font></span>
</div>
<div id="middle"></div>
<div id="msg">
<div style="width:100%font-size:13px">请输入内容:</div>
<div><input type="text" id="inp" style="width:154px"/></div>
<div style="text-align:center">
<button id="btn1">确定</button>     
<button id="btn2">取消</button>
</div>
</div>
