随笔分类 - HTML/CSS
摘要:介绍 "Ayer" 是一个干净且优雅的Hexo主题,自带响应式,加载速度很快,该有的功能都有,可配置项也很多,非常适合作为你的博客主题,主题内还附送了6张精美的高清壁纸。欢迎使用和Star支持,如果你在使用过程中有任何疑问或者建议,欢迎联系我! "项目地址" "效果预览" "中文说明" 特性 干净且
阅读全文
摘要:前几天做一个移动端的页面,要加个像微信那样附着在底部的回复框,按照做PC端网页的思路,首先是用fixed,在安卓上测了一下是好的,结果到同事的iphone6p上就不行了,点击输入框之后它总会跳到屏幕中间去。 后来才知道这是ios下一个普遍的bug,所以我决定把原因和解决方案整理一下,以方便后...
阅读全文
摘要:对一名前端来说,改页面的过程总是痛苦的,产品经理说要加个点击样式,于是加active的class,本来以为这样就OK了,没想到电脑上ok,本地测也是ok的,tomcat上一跑就没效果了。我甚至把! important也加上去了也没效果,于是就网上寻找答案,以下列出2种亲测有效的解决方法。一个方法是把...
阅读全文
摘要:最近在工作中遇到这个问题了,网上找了一些解决方案,全都试了一遍,有些没用有些有用,在此把靠谱的方法写出来。一.div模拟textarea以实现高度自适应CSS代码:.test_box { width: 400px; min-height: 120px; max-height: ...
阅读全文
摘要:最近网页布局中遇到得比较多,所以打算总结总结。word-wrap:1.normal(使用浏览器默认的换行规则) 2.break-word(内容将在边界内换行,但是英文换行会按词断句)word-break:1.break-all(无论中英文都可以直接在单词内断句)2.keep-all(只能在半角空格或...
阅读全文
摘要:如果想要撑开父元素可以采用以下方法:方法一:父元素设置overflow以及zoom,样式如下:1方法二:父元素也是设置浮动效果,样式如下:1此方法有个缺陷是,父元素的宽度需要设置。方法三:在添加一个子元素,并设置clear样式:12two3one45此方法添加了一个div元素,有些情况下可能这个di...
阅读全文
摘要:一些常用快捷键Ctrl + N-------------------新建Ctrl + F-------------------查找Ctrl+Shift +k -----------删除一行Ctrl+Shift +D -----------复制并增加一行Ctrl + H ---------------...
阅读全文
摘要:昨天晚上花了1个小时把慕课网上的PS切图教程看了一遍,发现之前用的切图方式有点low,还学习到一些设置技巧,在此记录。1.新建页面,背景内容设置为透明,自动选择不用打勾,后面的框选图层,这样按住ctrl鼠标点击就能快速找到对应图层2.标尺和智能参考线都打上勾3.历史记录,图层,信息,字符4个面板都打...
阅读全文
摘要:这是我自己在仿腾讯首页时遇到的布局问题,在此记录,如果有错,欢迎指正。首先是对齐问题,可以把父div的高度设置为0,然后调整padding值,这样可以批量调整子div们和其他父div的相对高度。这是父div的样式.loginicon { width: 1000px; height: 0p...
阅读全文
摘要:转自这里,收藏备用。不建议用了。text-align:center在父容器里水平居中 inline 文字,或 inline 元素vertical-align:middle垂直居中 inline 文字,inline 元素,配合 display:table ,display:table-cell,有奇效...
阅读全文
摘要:公司在做环形进度条的时候遇到了这个问题,上网一搜,原来是因为两个div背景图拼接起来的,所以中间出现了必不可少的缝隙,最后把position改为relative,再加个margin:0,就解决好了,下图为前后的截图对比。
阅读全文
摘要:用的时候首先记得加前缀:-webkit-,-moz-,-o-,-ms-,因为目前各个浏览器对CSS3和HTML5的兼容性还是参差不齐。边框:1.border-radius(实心圆的实现)2.box-shadow:X轴偏移量 Y轴偏移量 [阴影模糊半径] [阴影扩展半径] [阴影颜色] [投影方式](...
阅读全文