我希望<hr>在我的网站上为我的侧栏设置额外的标签.
如果我已经定义了hr,我怎么能这样做?
hr { border: solid #ddd; border-width: 1px 0 0; clear: both; margin: 22px 0 21px; height: 0; }
Run Code Online (Sandbox Code Playgroud)
我可以加一个风格吗?
hr.side { border: solid #ddd; border-width: 1px 0 0; clear: both; margin: 22px 0 21px; height: 0; }
Run Code Online (Sandbox Code Playgroud)
所以HTML会
<hr class="side"> ?
预言:最初我只记得Windows,但经过一段时间的Mac Air测试后,意识到它更糟糕.虽然在实际代码中它并不是那么麻烦,尽管存在一些不一致.
这是测试 http://jsbin.com/ehegaj/6/edit
简而言之,发生了什么.我有应用line-height属性的标题,这总是一行标题所以我锁定高度只是为了适合字体.在不同的浏览器(和操作系统)中,您可以看到文本的区别不同.有什么想法如何解决?
UPD:这里http://jsbin.com/uzucuf/1/edit是我做的实际工作的非常接近的例子,再次它不像上面的样本测试那么糟糕,但仍然有移动像素.
UPD2:
是否有更多的测试主要集中在Windows 7上,并且测试屏幕截图包含在不同浏览器中的图像,具有不同的线高.你可以看到它们之间的视觉上的不一致.
http://imageshack.us/a/img845/6734/testheaders.png它大概是1px,所以实际上我可以通过使用线高度29px并为IE提供不同的线高度30px来修复它.虽然我只是留下30px的线高并忽略了safari,所以在这一点上我很好.
所以只是好奇为什么会这样?迫切需要花费几个小时浏览不同的资源:
这个家伙,看起来有同样的问题,但只是摆脱找到问题的原因.
其他人建议只使用偶数值,line-height在我看来有点奇怪:)请纠正我,如果我在这里做错了.
其他一些但有些不相关的话题只是非常有兴趣阅读.
最后,看起来我找到答案,它有点模糊,但实际上是有道理的.
1.三组行间距值
由于源自TrueType和OpenType字体格式历史的不明原因,每个webfont都带有三组行间距值.在系统7中引入的"旧Mac"设置.在旧的Mac OS中,如果字形到达"旧Mac"行间距线的上方或下方,则字形将被垂直挤压以适应.
在Windows 3.1中引入的"旧Windows"集,其中在"旧Windows"上升线和下行线上方或下方的轮廓的任何部分都不会出现在屏幕上(因此字形将被裁剪).一个"排版"集,据说没有其他两个集的限制.
但问题是,许多Windows应用程序仍然使用"旧Windows"值.通常这是故意完成的,以防止从使用旧应用程序创建的文档中重排.在Mac OS X上,压缩不会发生,但大多数应用程序仍然使用"旧Mac"值.
这件行李已被带入浏览器.Mac OS X上的Chrome使用的值与Windows上的Chrome不同; Windows 7上的Firefox使用的值与Windows XP上的Firefox不同,Windows 7上的Firefox使用的值与Windows 7上的Chrome不同.相同浏览器的Mac和Windows版本将使用不同的值集,而不同同一操作系统上的浏览器也可能使用不同的值!在理想的世界中,简单的解决方案是让字体代工厂确保所有三组值都能产生相同的结果.但是许多现有字体是在构思webfonts之前创建的,而字体创建工具并不能让类型设计者轻松地使这些值"正确".
简而言之:有许多字体,其中行间距值导致操作系统和浏览器之间的不一致.
但我仍然不是100%肯定的情况.可能是有人做出更好的猜测,并给出更明确的答案,就像孩子的解释:)?
阅读有关fileReader的文档,并发现他们使用void运算符编写方法,如下所示:
void readAsArrayBuffer (
in Blob blob
);
Run Code Online (Sandbox Code Playgroud)
只是试着明白为什么他们这样写呢?如果有这种语法的实际用途?
事后证明它根本不是js,而是IDL,它是接口描述语言.
仅供参考:在提出这个问题之前,我会谷歌并阅读JS中的实际void运算符.所以请没有需要让我回来.问题有点模糊,但它必须处理,为什么Mozilla有关于这样编写的JavaScript的文档?在IDL中,实际的JavaScript几乎没有?
css ×2
api ×1
fonts ×1
idl ×1
javascript ×1
node.js ×1
npm ×1
npm-install ×1
styling ×1
webidl ×1