border-box 告诉浏览器去理解你设置的边框和内边距的值是包含在width内的。也就是说,如果你将一个元素的width设为100px,那么这100px会包含其它的border和padding,内容区的实际宽度会是width减去border + padding的计算值。大多数情况下这使得我们更容易的去设定一个元素的宽高。
设置 box-sizing: border-box;
后,简言之:
- 盒子的宽度 = border + padding + width
- 盒子的高度 = border + padding + height
"设置 box-sizing 为 border-box 后外边距(margin)会合并吗"继续阅读
一、作用
离线浏览 - 根据文件规则把资源缓存在本地,脱机依然能够访问资源,联网会直接使用缓存在本地的文件。优化加载速度,节约服务器资源。
"H5应用程序缓存 - Cache manifest"继续阅读
一、问题
- 多个浮动的元素无法撑开父元素的宽度,父元素的高度可能会变成0。
- 若浮动元素后面跟非浮动元素,非浮动元素会紧随其后浮动起来。
- 若浮动元素前面还有同级元素没有浮动则会影响页面结构。
"浮动元素引起的问题和解决办法"继续阅读
最近一个项目有页面全屏的的需求,搜索了下有HTML5的全屏API可用,不过各浏览器的支持不一样。
"HTML5全屏浏览器兼容方案"继续阅读
一、order属性
order属性定义项目的排列顺序。数值越小,排列越靠前,默认为0。
"CSS3 Flex布局(项目)"继续阅读
一、flex-direction属性
"CSS3 Flex布局(容器)"继续阅读
一、介绍
单页面结构简单、布局清晰,常常用来做手机 App 或者某个产品的下载介绍页面。现在,展示型网页整体趋向于单页网站设计,这样一次性把核心信息展现出来,对于用户来说更加直观和简单,能够快速了解一个产品。
"Bootstrap实战 - 单页面网站"继续阅读
介绍了社交媒体网站评论功能的实现,使用 Bootstrap 媒体对象构建评论组件。详细讲解了基础媒体对象、多层嵌套、对齐方式及列表应用,最后通过实例展示如何创建评论列表。
介绍了注册和登录模块的实现,使用 Bootstrap 标签页和表单构建可切换的登录注册界面。详细讲解了标签页的基础和进阶用法、按钮样式以及表单布局与验证。最后通过实例展示如何创建切换登录和注册的模块。
早些时候写的,记录一下。
"HTML友情链接代码"继续阅读