HTML 的隐藏功能
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/954327/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Hidden features of HTML
提问by Binoj Antony
HTML being the most widely used language (at least as a markup language) has not gotten its due credit.
Considering that it has been around for so many years, things like the FORM / INPUT controls have still remained same with no new controls added.
HTML 作为最广泛使用的语言（至少作为标记语言）并没有得到应有的赞誉。
考虑到它已经存在了这么多年，诸如 FORM / INPUT 控件之类的东西仍然保持不变，没有添加新控件。
So at least from the existing features, do you know any features that are not well knownbut very useful.
所以至少从现有的功能来看，你知道有哪些不为人所知但非常有用的功能。
Of course, this question is along the lines of:
当然，这个问题的思路是：
Hidden Features of JavaScript
Hidden Features of CSS
Hidden Features of C#
Hidden Features of VB.NET
Hidden Features of Java
Hidden Features of classic ASP
Hidden Features of ASP.NET
Hidden Features of Python
Hidden Features of TextPad
Hidden Features of Eclipse
JavaScript 的
隐藏特性 CSS 的
隐藏特性 C# 的
隐藏特性 VB.NET 的
隐藏特性 Java 的
隐藏特性 经典 ASP 的
隐藏特性 ASP.NET 的
隐藏特性 Python 的
隐藏特性 TextPad 的
隐藏特性 Eclipse 的隐藏特性
Do not mention features of HTML 5.0, since it is in working draft
不要提及 HTML 5.0 的特性，因为它在工作草案中
Please specify one feature per answer.
请为每个答案指定一项功能。
回答by Paul Irish
Using a protocol-independent absolute path:
使用独立于协议的绝对路径：
<img src="//domain.com/img/logo.png"/>
If the browser is viewing an page in SSL through HTTPS, then it'll request that asset with the https protocol, otherwise it'll request it with HTTP.
如果浏览器正在通过 HTTPS 查看 SSL 页面，那么它将使用 https 协议请求该资产，否则它将使用 HTTP 请求它。
This prevents that awful "This Page Contains Both Secure and Non-Secure Items" error message in IE, keeping all your asset requests within the same protocol.
这可以防止 IE 中出现可怕的“此页面包含安全和非安全项目”错误消息，将所有资产请求保持在同一协议中。
Caveat: When used on a <link> or @import for a stylesheet, IE7 and IE8 download the file twice. All other uses, however, are just fine.
警告：当用于样式表的 <link> 或 @import 时，IE7 和 IE8 会下载文件两次。但是，所有其他用途都很好。
回答by Brian Reiter
The label tag logically links the label with the form element using the "for" attribute. Most browsers turn this into a link which activates the related form element.
label 标签使用“for”属性将标签与表单元素进行逻辑链接。大多数浏览器将其转换为激活相关表单元素的链接。
<label for="fiscalYear">Fiscal Year</label>
<input name="fiscalYear" type="text" id="fiscalYear"/>
回答by aleemb
The contentEditableproperty for (IE, Firefox, and Safari)
用于（IE、Firefox 和 Safari）的contentEditable属性
<table>
<tr>
<td><div contenteditable="true">This text can be edited<div></td>
<td><div contenteditable="true">This text can be edited<div></td>
</tr>
</table>
This will make the cells editable! Go ahead, try itif you don't believe me.
这将使单元格可编辑！来吧，如果你不相信我，试试吧。
回答by RichardOD
I think the optgroup tagis one feature that people don't use very often. Most people I speak to don't tend to realise that it exists.
我认为optgroup 标签是人们不经常使用的一项功能。大多数与我交谈的人都没有意识到它的存在。
Example:
例子：
<select>
<optgroup label="Swedish Cars">
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
</optgroup>
<optgroup label="German Cars">
<option value="mercedes">Mercedes</option>
<option value="audi">Audi</option>
</optgroup>
</select>
回答by Fenton
My favourite bit is the base tag, which is a life saver if you want to use routing or URL rewriting...
我最喜欢的一点是基本标签，如果你想使用路由或 URL 重写，它是一个救命稻草......
Let's say you are located at:
假设您位于：
www.anypage.com/folder/subfolder/
The following is code and results for links from this page.
以下是此页面链接的代码和结果。
Regular Anchor:
常规锚：
<a href="test.html">Click here</a>
Leads to
造成
www.anypage.com/folder/subfolder/test.html
Now if you add base tag
现在如果你添加基本标签
<base href="http://www.anypage.com/" />
<a href="test.html">Click here</a>
The anchor now leads to:
锚点现在导致：
www.anypage.com/test.html
回答by Daniel Silveira
<img onerror="{javascript}" />
onerroris a JavaScript event that will be fired right before the little red cross (in IE) picture is shown.
onerror是一个 JavaScript 事件，将在显示小红叉（在 IE 中）图片之前触发。
You could use this to write a script that will replace the broken image with some valid alternative content, so that the user doesn't have to deal with the red cross issue.
您可以使用它来编写一个脚本，用一些有效的替代内容替换损坏的图像，这样用户就不必处理红十字问题。
On the first sight this can be seen as completely useless, because, wouldn't you know previously if the image was available in the first place? But, if you consider, there are perfect valid applications for this thing; For instance: suppose you are serving an image from a third-party resource that you don't control. Like our gravatar here in SO... it is served from http://www.gravatar.com/, a resource that the stackoverflow team doesn't control at all - although it is reliable. If http://www.gravatar.com/goes down, stackoverflow could workaround this by using onerror.
乍一看，这完全没有用，因为，您之前不知道该图像是否可用吗？但是，如果您考虑一下，这件事有完美的有效应用程序；例如：假设您正在提供来自您无法控制的第三方资源的图像。就像我们在 SO 中的 gravatar 一样......它来自http://www.gravatar.com/，stackoverflow 团队根本无法控制的资源 - 尽管它是可靠的。如果http://www.gravatar.com/出现故障，stackoverflow 可以通过使用onerror.
回答by Russ Cam
The <kbd>element for marking up for keyboard input
<kbd>用于标记键盘输入的元素
Ctrl+Alt+Del
Ctrl+ Alt+Del
回答by Mark Glorie
<blink>
Must be used for anything important on the site. Most important sites wrap all of content in blink.
必须用于网站上的任何重要内容。最重要的网站瞬间包装了所有内容。
<marquee>
Creates a realistic scrolling effect, great for e-books etc.
创建逼真的滚动效果，非常适合电子书等。
Edit: Easy-up fellas, this was just an attempt at humour
编辑：轻松的家伙，这只是幽默的尝试
回答by aleemb
Not very well known but you can specify lowsrcfor images which will show the lowsrcwhile loading the srcof the image:
不是很出名，但您可以指定lowsrc将显示lowsrc加载src图像时的图像：
<img lowsrc="monkey_preview.png" src="monkey.png" />
This is a good option for those who don't like interlacedimages.
对于那些不喜欢隔行扫描图像的人来说，这是一个不错的选择。
A little bit of trivia: at one point this property was obscure enough that it was used to exploit Hotmail, circa 2000.
一点点小知识：在大约 2000 年，这个属性一度非常模糊，以至于它被用来利用 Hotmail。
