前端
EricHedgedog
嗜肉,嗜酒,嗜茶,嗜咖啡
展开
-
什么是 CSS 层叠上下文,它们是如何工作的?
本文由 伯乐在线 - EricHedgedog 翻译,renlytime 校稿。未经许可,禁止转载!英文出处:Quora。CSS层叠上下文给很多开发者都带来过困扰。在我写完《CSS Master》中的布局章节之前,我都不能说自己已经完全理解了它们。当然了,我理解元素的 z-index 属性是需要 position 属性不为 static 时才能生效的,但这也是在我读了无数次Phil翻译 2016-03-03 10:54:50 · 465 阅读 · 0 评论 -
JQuery实现input上传图片显示缩略图
JQuery实现input上传图片显示缩略图最近做一套手机商城页面,在退款申请页面有上传图片显示缩略图的功能,以前没有做过这个,所以整理了一下。HTML :<p>上传图片:</p> <div id="imgPreview"></div> <span class="upload-img"><input id="fileUpload" accept="image/*" type="file"原创 2016-03-04 16:25:10 · 13537 阅读 · 7 评论 -
编写高质量前端代码
高质量的HTML代码做到标签的语义化,不过度使用div而忽略一些其他的具有语义化的标签,例如标题就用h标签,内容就用p标签,等等,这些无论对搜索引擎的优化还是代码的可读性都有好处。要做到页面即使去掉CSS,也具有良好的可读性结构。高质量的CSS代码对于高度复用部分,通用类以及特异化部分可以分别放到各自的CSS中,如通用类(css-reset.css),复用类(public.css),特定页面原创 2016-03-22 17:19:46 · 415 阅读 · 0 评论 -
利用overflow:hidden属性自动充满父级剩余宽度实现自适应
前段时间需要做一系列移动站的水平布局表单,即 <label> 和 <input> 在同一行内, 并且要做到自适应占满全屏,第一次使用 overflow:hidden 属性来实现在 <label> 标签定宽的情况下,右部输入框部分自适应铺满剩余空间。HTML代码如下:<div class="clearfix input-row"> <label>企业名称:</label> <div clas原创 2016-04-12 14:51:57 · 11385 阅读 · 1 评论 -
页面中元素的垂直居中
页面中垂直居中的几种方法:1. 通过使用absolute定位来实现垂直居中在需要垂直居中的元素的长宽已知的情况下可以使用此方法。HTML: <div class="bg"> <div class="center-div"> <img src=""/> </div> </div>CSS: <style type="text原创 2016-04-19 13:53:23 · 488 阅读 · 0 评论 -
Boostrap 二级模态框关闭后导致一级模态框无法滚动
很久没怎么用过bootstrap了, 本来也没有怎么深入使用过,今天在修复一个微商城后台的老代码的时候,发信一个bootstrap的bug:当已经打开一个一级模态框之后,再继续打开一个二级模态框, 然后关闭二级模态框,一级模态框长度大于视窗的时候,会导致一级模态框无法向下滚动原因: 当二级模态框关闭的时候,会移除body标签上的modal-open 类名,bootstrap可能并没有考虑到会有二级原创 2017-11-23 17:33:18 · 1468 阅读 · 0 评论