相关推荐
纯css来做表单校验样式
css3新增了三个伪类：:required、:valid、:invalid:required 表示input不能为空时使用的:valid 表示通过，表单元素和form表单都有的伪类:invalid 表示不通过，表单元素和form表单都有的伪类其实如果要做一个表单css校验样式，:valid和:invalid就行了，但是实际操作上，:invalid还是有一些问题的。当表单元素有required属性的时候，该表单元素默认就是:invalid，也就说，必填的表单元素，一开始就是不通过。所以，如果此时设置:invalid伪类样式，是不合适的。解决办法就是：使用:placeholder-shown...
移动端适配iPhoneX和安卓底部小黑条
这个问题还是同事发现的，毕竟我这种穷人根本用不起苹果，更何况也用不来，毕竟，我爱安卓。废话不多说，主要问题就是 iPhoneX底部小黑条问题，他的宽度也会被网页占据，导致小黑条显示在网页上头，第一是触发上会出现问题，第二是难看。解决办法就是通过css处理。解决方案首先对meta标签添加一条属性。<meta name="viewport" content="width=device-width, viewport-fit=cover">如果你已经有了viewport声明，那么就在后面content里加上viewport-fit=cover...
css使用系统字体作为网页字体最佳实践
目前前端对字体的选择，最好的做法就是用系统的默认字体，这样省去了对每个操作系统的字体判断，谁知道我们指定的这个字体用户安装没有，而且字体文件一向都很大，特别是中文字体。但是对于指定系统字体，其实也是需要兼容的，这里就放上一个专业的字体文章：《奇思妙想 CSS 文字动画》；虽然这个文章名字叫动画，但是里面内容很丰富，自己学习。以css-tricks的为模板，提取其中精华，大概是这么一条信息：{ font-family: system-ui, -apple-system, BlinkMacSystemFont, segoe ui, Roboto, Helvetica, Arial, ...
通用一键复制代码的方法
最近想给博客主题增加一个一键复制代码的功能，结果发现highlight.js并不支持一键复制，这就非常的可惜啊。于是百度了下，找到一个不错的例子，根据其例子我自己写了一个通用的方式。效果图安装[hide]需要使用clipboard.js，所以需要js引入这个复制用的库<script type="text/javascript" src="https://cdn.staticfile.org/clipboard.js/2.0.6/clipboard.min.js"></script>引入完毕后我们需要给每个代码块增加一个复制按...
为博客添加鼠标点击特效（富强、民主、文明、和谐...）全平台通用 V2.0
已经写了新版，jq的方法，地址：jq富强，如果连接失效可以在本博客搜索富强，也可以找到对应的文章经过长时间的学习，终于迎来小高潮，更新为2.0版本！2018-10-5 修复预加载js代码失效bug2018-11-3 修复了当鼠标在最右侧点击时导致X轴产生滚动条的问题2019-1-8 更新为2.0版本，修复大量bug，引用自制代码库预览图：使用要求：需要引入自制代码库：[hide]先引入tool.js 下载：蓝奏云再引入封装库base.js 下载：蓝奏云接着引入china.js 下载 ： 蓝奏云[/hide]引入方法：以我现在的博客Typecho为例，我们需要在主题的header.ph...
终于给博客的搜索按钮加上了事件切换器
都是辛酸泪，这几天学这个头大，不过好在我搞定了，并且还不会冲突，兼容ie9以上，相当奈斯！2018-10-5 重新做了兼容，虽然没什么卵用，美名其曰优化代码！效果图：原理就是通过修改class的名字来达到隐藏和显示的效果，并且修复了原来动效不能显示的bug。代码部分（css部分我就不提供了）：[hide]//兼容添加事件 function addEvent(obj,type,fn) { if(obj.addEventListener) { obj.addEventListener(type,fn,false); }else if(obj.attachEve...
关于作者
