摘要:难题 可能有人已经注意到了,有时 或者 是不会默认继承样式的,尤其是 ,直观就能看出来了。 原因 根据SO的回答,因为浏览器会采用系统默认的样式来渲染大部分的表单元素,而且这个默认的样式文件还能找到。想深入了解的可以戳下方参考文档链接。 方案 主动加上 ,并不是什么好方案,但是也没找到更好的。 参考 阅读全文
posted @ 2018-05-11 18:37 xianshenglu 阅读(351) 评论(0) 推荐(0) 编辑
摘要:前言: 布局时,通常情况下, inline blocks 之间有空白,尽管通常我们是不想要的,毕竟不像 或者 一样好控制,如图: 原因 产生空白的原因,其实有两个: 默认为 ,根据 上来说,就是 连续的空白符会被合并,换行符会被当作空白符来处理。填充line盒子时,必要的话会换行。 这个不合理么?不 阅读全文
posted @ 2018-05-11 10:39 xianshenglu 阅读(186) 评论(0) 推荐(0) 编辑
摘要:借 [Lea verou][1] 的话: 当某些值相互依赖时,应该把它们的相互关系用代码表达出来。 通常情况下,我们会希望字号和其他尺寸能够跟父元素的字号建立关联,此时 就很好的表达了这种关系。 在[CSS Values and Units Module Level 3][2]中,有一个相对长度单位 阅读全文
posted @ 2018-05-10 21:41 xianshenglu 阅读(120) 评论(0) 推荐(0) 编辑
摘要:难题 有的时候,特别想通过字符来判断元素的长度,比如: 1. 多行文本溢出时,文字变省略号 2. 文字一个个的显示 效果分别如下: 第一种情况下,如果可以通过字符的数量判断长度是否溢出,从而把最后几个字符替换成省略号,那就没问题,然而通常情况下,i和M占的宽度明显是不一样的,即使一样,也不知道它的宽 阅读全文
posted @ 2018-05-10 14:56 xianshenglu 阅读(210) 评论(0) 推荐(0) 编辑
摘要:日常通过MDN查文档没有什么问题,但是有些API找不到或者原理搞不清,只能查查规范是怎么说的,所以本文就说说,怎么查规范。 查规范前首先要知道规范在哪里... 首先进入[w3][1],进一步搜索就到了[ALL STANDARDS AND DRAFTS][2],到这里就可以找到 、`CSS DOM W 阅读全文
posted @ 2018-05-08 14:18 xianshenglu 阅读(245) 评论(0) 推荐(1) 编辑
摘要:读《css揭秘》时,发现选择器的神奇作用,可以确定子元素数目,比如: 这个适用于第一个子元素为 且父元素拥有2个子元素,则第一个 和后续的 都将适用,并且如果有更多或更少的子元素都不会适用。 仔细思考下其中的核心逻辑: = 即是第1个,又是倒数第2个= 总共有两个子元素 利用选择器还可以继续拓展: 阅读全文
posted @ 2018-05-07 15:32 xianshenglu 阅读(736) 评论(0) 推荐(0) 编辑
摘要:`table layout:auto` 是表格布局中的默认值,采用浏览器自动表格布局算法,但是缺点会很明显 给 指定的 不一定生效, 的`width`会自动调整 也会失效,同样, 会撑大 举个例子: 这样的结果就是这样的: 的 和 都没有溢出隐藏,反而撑大了 ,但是如果把 改为 ,效果如图: 的`t 阅读全文
posted @ 2018-05-07 11:27 xianshenglu 阅读(8001) 评论(0) 推荐(1) 编辑
摘要:`textarea resize`样式,效果就是下面这样 读 《css 揭秘》时发现两个亮点: 其实这个属性不仅适用于 元素,适用于下面所有元素: elements with overflow other than visible, and optionally replaced elements 阅读全文
posted @ 2018-05-06 16:38 xianshenglu 阅读(401) 评论(0) 推荐(0) 编辑
摘要:背景知识: " " " " 难题: " " 为 100% 100% 时, " " 部分失效; 示例 效果如图: 从图中可以看出: " " 为 100% 100% 时, " " 通过 % 来调整时是无效的; 如果要调整,也不是没有办法,这里先说为什么 % 调整无效,看文档 " " : With a v 阅读全文
posted @ 2018-04-30 15:15 xianshenglu 阅读(555) 评论(0) 推荐(0) 编辑
摘要:背景知识: ,`background attachment:fixed; filter:blur()` 难题: 通常,我们会通过 去实现背景高斯模糊,但是缺点很明显,整个背景都模糊了,能不能模糊其中指定的一块呢?比如: 能不能只模糊 区域呢? 尝试: 通过半透明的背景和 来实现 当然效果是不太好的: 阅读全文
posted @ 2018-04-29 12:48 xianshenglu 阅读(3422) 评论(0) 推荐(1) 编辑