带文本的switch(开关)效果通常还是挺常见，那怎么样实现这样的效果呢？下面小编就为大家捋一捋这个思绪，跟着我一起来看看吧！
工具/原料
1
sublime text3
2
谷歌浏览器
方法/步骤
1
打开sublime text3编辑器，文件->新建文件
2
ctrl+s”保存，需要输入文件名字，这里我就叫“switch开关”，童鞋们自己随意，不强求，然后保存，一个页面就建好了。
3
然后在页面输入英文“!”之后按“Tab”，生成一个简单的dom结构
4
写好所需页面结构，样式也写好（这里使用伪类before做的开关的圆点效果），这2样整好，下面就是js代码了，具体内容如图所示：
5
右键选择“在浏览器中打开”或者工具->sublimeserver->start sublimeserver，打开sublimeserver服务，右键选择 “view in sublimeserver”具体如下图所示：
6
浏览器效果如下图所示：我用的谷歌浏览器
上一篇：证明信的规范写法
下一篇：商家开发票怎么填入商家开户行