在定义样式前要设定一些默认样式 *{margin:0;padding:0;} html body{height:100%;} 一列布局 两个要点 页面内容区域有一个固定宽度。 页面内容区域在浏览器窗口中自适应居中 实现方…
分类:css
Codepen 每日精选(2018-4-20)
按下右侧的“点击预览”按钮可以在当前页面预览,点击链接可以打开原始页面。 图书打开的交互效果https://codepen.io/jcoulterde… 进度条交互效果https://codepen.io/j…
input标签不显示边框,或只在点击时不显示边框
input标签不显示边框 (1)不显示边框 (2)只在点击时不显示边框 (1)不显示边框 在样式中直接写:border-style: none; .search-input-box { width: 1040px; he…
[譯] scroll-behavior 滑順的捲動效果
眾所皆知 HTML 錨點(anchor link)透過給定標籤 id 屬性跳到頁面上特定位置的功能。不過這個效果感覺上就像是閃一下就切換到該位置。為了使用體驗上的感覺有時候網站會設計一種平滑捲動到該位置的效果。 在過去這…
手把手和你用原生JS写一个循环播放图片轮播
前段时间学习了淘宝首页的静态页面,其中收获较大的的就是这个循环播放的图片轮播组件,本文就将相关制作经验分享给大家。 先看看在线DEMO:原生JS循环播放图片轮播组件 (支持IE8+,本文中的在线demo均未经过…
浅谈web自适应
转自:http://www.cnblogs.com/consta… 前言 随着移动设备的普及,移动web在前端工程师们的工作中占有越来越重要的位置。移动设备更新速度频繁,手机厂商繁多,导致的问题是每一台机器的…
前端面试题大集合:来自真实大厂的532道面试题(只有题,没有答案)
答案自己谷歌或百度找。 一、来源背景 面试题是来自微博@牛客网发布的真实大厂前端面经题目,我一直在收集题目长期一个一个的记录下来的,可能会有重复,但基本前端的面试大纲和需要掌握的知识都在其中了,面试题仅做学习参考,学习者…
前端进阶(14) - 如何提升前端性能和响应速度
如何提升前端性能和响应速度 下面大多是从前端工程化的角度给出的优化建议,如果需要了解语法上的优化,可以参考: 如何提高页面加载速度 编写高效的JavaScript Web前端性能优化进阶 – 完结篇 1. 原…
ie8兼容问题
input标签placeholder 1.input里面的placeholder属性,在pc端用的特别好,但是万恶的ie8,placeholder竟然不支持。于是找到一种方法解决在ie8中placeholder无效的事 …
静态页面布局总结(新手)
学习HTML一个月了,对HTML和Css页面的静态布局进行一次总结 总体来说静态页面布局分为两大类,水平布局和垂直布局,只要水平布局和垂直布局都能熟悉了, 那么对于静态的页面的布局就不会有太大的问题 再说布局之前先说一下…