codepen.io
获得徽章 19
- 赞过
评论2 - 某些个人网站上会出现一些垃圾评论外链，有些外链的目的是为了提高自己网站的搜索引擎排名。
为了告知搜索引擎此外链不被网站信任，无需计入搜索排名。可以这样做：
<a rel="nofollow" target="_blank">
更进一步，添加避免本页面被外链网页操作的代码：
<a rel="nofollow noopener noreferrer" target="_blank">
参考链接：
ahrefs.com 展开赞过 评论1 - 在当前页面使用 `<a target="_blank">` 或 `window.open()` 打开新页面时，如果不做特殊处理，在新页面中可以使用 `window.opener` 访问当前页面的 `window` 对象。
后果是在新页面中能够重置当前页面的 url 地址：`window.opener.location = 'evil.com'`
为了避免这类事情发生，我们可以使用下图的做法。
参考链接：mathiasbynens.github.io 展开等人赞过 224 - :placeholder-shown 与 `<input>` 的 `<textarea>` 的 placeholder 属性有关。当输入框中的占位文本显示时，就匹配这个输入框。有几个边缘情况，需要注意：
demo 地址：codepen.io 展开等人赞过 评论4 - 使用 JavaScript 复制文本分三步：
1. 选择文本（input.select()）
2. 复制文本（document.execCommand('copy')）
3. 移除文本选择（window.getSelection().removeAllRanges()）
demo 地址：codepen.io 展开等人赞过 528 - CSS 逻辑属性：inline-size、block-size
inline-size、block-size 属性的含义与网页的书写模式（writing-mode）有关。以文字排版为例：
- 文字书写的方向称为 x/inline 轴，元素在这个轴上占据的尺寸称为 inline size。
- 文字折行的方向称为 y/block 轴，元素在这个轴上占据的尺寸称为 block size。
因此这两个属性跟 width、height 存在某种对应关系：
- 在默认书写模式（writing-mode: horizontal-tb;）下，width = inline-size，height = block-size
- 而在垂直书写模式下（比如 writing-mode: vertical-rl;）下，width = block-size，height = inline-size
demo 地址：codepen.io 展开赞过 评论1
