logo头像

叩首问路,码梦为生

CSS

读书笔记系列(8)——CSS Secrets

读书笔记系列(8)——CSS Secrets

这本书被誉为近十年来最出色的一本 CSS 相关书籍,作者是被誉为 “CSS一姐” 的 Lea Verou,是 W3C CSS 工作组特邀专家,而我看的是这本书的译本(翻译为 CSS 揭秘),作者叫张鹏,是百姓网的前端架构师;译者翻译的...

CSS布局问题总结

CSS布局问题总结

本文主要对 CSS 中常见的布局问题进行了总结,同时提供了解决方案和一些参考链接,涉及到三栏式布局(圣杯、双飞翼),居中布局等等;感兴趣的童鞋可以点击来源链接查看原文,因为本文是基于原文进行整理的,所以内容会比原文精简。 基础知识 学...

纯CSS实现自适应正方形

纯CSS实现自适应正方形

首先,自适应正方形是指宽度和高度随着屏幕宽度(不管是移动端还是 PC 端)进行等比例变化的正方形,在处理移动端页面时,我们有时会需要将 banner 图做成与屏幕等宽的正方形以获得最佳的体验效果,如 Flipbord的移动页面,而在 ...

CSS深入理解之border

CSS深入理解之border

1. 不支持百分比单位的属性 border-width outline box-shadow text-shadow 2. border-width 支持关键字 thin –> 1px medium(默认值)–> 3px...

CSS深入理解之float

CSS深入理解之float

1. float 的历史浮动设计的初衷: 实现文字环绕 2. float 感性认知float 具有包裹性和破坏性 具有包裹性的小伙伴: display: inline-block / table-cell / … position: ...

CSS深入理解之overflow

CSS深入理解之overflow

1. overflow 起作用的前提 非 display:inline水 平 对应方位的尺寸限制 .width / height / max-width / max-height / absolute 拉伸 对于单元格 td 等,还需...

CSS深入理解之absolute

CSS深入理解之absolute

1. 超越 overflow独立的 absolute 可以摆脱 overflow 的限制,无论是滚动还是隐藏 2. 无依赖的 absolute不受 relative 限制的 absolute 定位,行为表现上是不使用 top / ri...