html5常见问题_HTML5常见问题
html5常见问题
After this quick introduction to HTML5 markup, you probably have a bunch of questions swirling in your head. Here are some answers to a few of the likely ones.
快速介绍完HTML5标记之后，您可能会想到很多问题。 以下是⼀些可能答案的答案。
为什么这些更改在旧版浏览器中仍然有效？ (Why do these changes still work in older browsers?)
To understand why this isn’t a problem, we can compare HTML5 to some of the new features added in CSS3, which we’ll be discussing in later chapters.
为了理解为什么这不是问题，我们可以将HTML5与CSS3中添加的⼀些新功能进⾏⽐较，我们将在后⾯的章节中进⾏讨论。
In CSS, when a new feature is added (for example, the border-radius property that adds rounded corners to elements), that feature also has to be added to browsers’ rendering engines, so older browsers will fail to recognize it. If a user is viewing the page on a browser with no support for border-r
adius, the rounded corners will appear square. This happens because square corners are the default and the browser will ignore the border-radius declaration. Other CSS3 features behave similarly, causing the experience to be degraded to some degree.
在CSS中，当添加新功能时(例如，将圆⾓添加到元素的border-radius属性)，该功能也必须添加到浏览器的渲染引擎中，因此较旧的浏览器将⽆法识别它。 如果⽤户在不⽀持border-radius的浏览器上查看页⾯，则圆⾓将显⽰为正⽅形。 发⽣这种情况是因为默认为四⾓，浏览器将忽略border-radius声明。 其他CSS3功能的⾏为类似，导致体验在⼀定程度上降低。
Many developers expect that HTML5 will work in a similar way. While this might be true for some of the advanced features and APIs we’ll be considering later in the book, it’s not the case with the changes we’ve covered so far; that is, the simpler syntax, fewer superfluous attributes, and the new doctype.
许多开发⼈员期望HTML5将以类似的⽅式⼯作。 尽管对于某些⾼级功能和API可能是正确的，我们将在本书的后⾯部分进⾏讨论，但到⽬前为⽌我们所做的更改并⾮如此。 也就是说，语法更简单，多余的属性更少以及新的doctype。
HTML5’s syntax was more or less defined after a careful study of what older browsers can and can’t
handle. For example, the 15 characters that comprise the doctype declaration in HTML5 are the minimum characters required to make every browser display a page in standards mode.
在仔细研究了旧版浏览器可以处理和不能处理的内容之后，或多或少定义了HTML5的语法。 例如，组成HTML5中的doctype声明的15个字符是使每个浏览器以标准模式显⽰页⾯所需的最少字符。
Likewise, while XHTML required a lengthier character-encoding declaration and an extra attribute on the html element for the purpose of validation, browsers never actually required them in order to display a page correctly. Again, the behavior of older browsers was carefully examined, and it was determined that the character encoding could be simplified and the xmlns attribute removed—and browsers would still see the page the same way.
同样，尽管XHTML需要更长的字符编码声明和html元素上的额外属性来进⾏验证，但浏览器实际上并不需要它们才能正确显⽰页⾯。 再次仔细检查了旧版浏览器的⾏为，并确定可以简化字符编码并删除xmlns属性，并且浏览器仍会以相同的⽅式查看页⾯。
Unlike changes to CSS3 and JavaScript, where additions are only supported when browser makers actually implement them, there’s no need to wait for new browser versions to be released before using HTML5’s markup syntax. And when it comes to using the new semantic elements, a small snip
pet of JavaScript is all that’s required to bring any really old browsers into line.
与CSS3和JavaScript的更改不同，CSS3和JavaScript的更改仅在浏览器制造商实际实现时才受⽀持，⽽⽆需使⽤HTML5的标记语法来等待新版本的浏览器发布。 在使⽤新的语义元素时，只需使⽤⼀⼩段JavaScript即可使所有真正的旧浏览器都可以使⽤。
注意：标准模式与怪癖模式 (Note: Standards Mode versus Quirks Mode)
When standards-based web design was in its infancy, browser makers were faced with a problem: supporting emerging standards would, in many cases, break backwards compatibility with existing web pages that were designed to older, nonstandard browser implementations. Browser makers needed a signal indicating that a given page was meant to be rendered according to the standards. They found such a signal in the doctype: new standards-compliant pages included a correctly formatted doctype, while older nonstandard pages generally didn’t. Using the doctype as a signal, browsers could switch between standards mode (in which they try to follow standards to the letter in the way they render elements) and quirks mode (where they attempt to mimic the “quirky” rendering capabilities of older browsers to ensure that the page renders how it was intended).
当基于标准的⽹页设计处于起步阶段时，浏览器制造商就⾯临⼀个问题：在许多情况下，⽀持新兴标
准将破坏与旨在⽤于较旧的⾮标准浏览器实现的现有⽹页的向后兼容性。 浏览器制造商需要⼀个信号来指⽰要根据标准呈现给定的页⾯。 他们在doctype中发现了这样的信号：新的符合标准的页⾯包括格式正确的doctype，⽽较旧的⾮标准页⾯通常没有。 使⽤doctype作为信号，浏览器可以在标准模式(尝试以呈现元素的⽅式遵循字母的标准)和怪癖模式(尝试模仿旧版浏览器的“怪异”渲染功能)之间进⾏切换。确保页⾯呈现预期的效果)。
It’s safe to say that in the current development landscape, nearly every web page has a proper doctype, and thus will render in standards mode; it’s therefore unlikely that you’ll ever have to deal with a page rendered in quirks mode. Of course, if a user is viewing a web page using a very old browser (such as IE4), the page will be rendered using that
browser’s rendering mode. This is what quirks mode mimics, and it will do so regardless of the doctype being used.
可以肯定地说，在当前的开发环境中，⼏乎每个⽹页都具有适当的doctype，因此将以标准模式呈现。 因此，您⼏乎不必处理以怪癖模式呈现的页⾯。 当然，如果⽤户正在使⽤⾮常⽼的浏览器(例如IE4)查看⽹页，则将使⽤该浏览器的呈现模式来呈现该页⾯。 这就是怪癖模式所模仿的，⽆论使⽤哪种doctype，它都会这样做。
Although the XHTML and older HTML doctypes include information about the exact version of the specification they refer to, browsers have never actually made use of that information. As long as a seemingly correct doctype is present, they’ll render the page in standards mode. Consequently, HTML5’s doctype has been stripped down to the bare minimum required to trigger standards mode in any browser. Further information, along with a chart that outlines what will cause different browsers to render in quirks mode, can be found on You can also read a good overview of standards and quirks mode on
尽管XHTML和较旧HTML⽂档类型包含有关它们所引⽤规范的确切版本的信息，但浏览器从未真正使⽤过该信息。 只要存在看似正确的doctype，它们就会以标准模式呈现页⾯。 因此，HTML5的doctype已被精简到触发任何浏览器中的标准模式所需的最低限度。 可以在上到更多信息以及概述导致不同浏览器以怪癖模式呈现的内容的图表 您还可以在上阅读有关标准和怪异模式的完整概述
html中的5种空格表示是否应该关闭所有标签？ (Shouldn’t all tags be closed?)
In XHTML, all elements were required to be closed—either with a corresponding closing tag (such as html) or in the case of void elements, a forward slash at the end of the tag. Void elements are elements that can’t contain child elements (such as input, img, or link).
在XHTML中，要求所有元素都必须关闭-使⽤相应的结束标记(例如html )，或者在void元素的情况下，在标记末尾使⽤正斜杠。 ⽆效元素是不能包含⼦元素的元素(例如input ， img或link )。
You can still use that style of syntax in HTML5—and you might prefer it for consistency and maintainability reasons—but adding a trailing slash on void elements is no longer required for validation. Continuing with the theme of “cutting the fat,”HTML5 allows you to omit the trailing slash from such elements, arguably leaving your markup cleaner and less cluttered.
您仍然可以在HTML5中使⽤该样式的语法(出于⼀致性和可维护性的原因，您可能会更喜欢它)，但是验证不再需要在void元素上添加斜杠。 继续以“减少脂肪”为主题，HTML5允许您省略此类元素的尾部斜杠，可以说是使标记更整洁，更混乱。
It’s worth noting that in HTML5, most elements that can contain nested elements—but simply happen to be empty—still need to be paired with a corresponding closing tag. There are exceptions to this rule (such as p tags and li tags), but it’s simpler to assume that it’s universal.
值得注意的是，在HTML5中，⼤多数可以包含嵌套元素的元素(但恰好是空的)仍然需要与相应的结束标记配对。 该规则有⼀些例外情况(例如p标签和li标签)，但是更容易假定它是通⽤的。
其他基于XHTML的语法习惯⼜如何呢？ (What about other XHTML-based syntax customs?)
While we’re on the subject, omitting closing slashes is just one aspect of HTML5-based syntax that differs from XHTML. In fact, syntax style issues are completely ignored by the HTML5 validator, which will only throw errors for code mistakes that threaten to disrupt your document in some way.
当我们讨论这个主题时，省略斜杠只是基于HTML5的语法的⼀个⽅⾯，与XHTML不同。 实际上，HTML5验证程序完全忽略了语法样式问题，它只会对可能以某种⽅式破坏⽂档的代码错误抛出错误。
What this means is that through the eyes of the validator, the following five lines of markup are identical:
这意味着在验证者的眼中，以下五⾏标记是相同的：
<link rel="stylesheet" href="css/styles.css" />
<link rel="stylesheet" href="css/styles.css">
<LINK REL="stylesheet" HREF="css/styles.css">
<Link Rel="stylesheet" Href="css/styles.css">
<link rel=stylesheet href=css/styles.css>
In HTML5, you can use lowercase, uppercase, or mixed-case tag names or attributes, as well as quoted or unquoted attribute values (as long as those values don’t contain spaces or other reserved characters), and it will all validate just fine.
在HTML5中，您可以使⽤⼩写，⼤写或⼤⼩写混合的标签名称或属性，以及带引号或不带引号的属性值(只要这些值不包含空格或其他保留字符)，它们都将仅⽤于验证精细。
In XHTML, all attributes were required to have values, even if those values were redundant. For example, in XHTML you’d often see markup like this:
在XHTML中，所有属性都必须具有值，即使这些值是多余的也是如此。 例如，在XHTML中，您经常会看到这样的标记：
<input type="text" disabled="disabled" />
In HTML5, attributes that are either “on” or “off” (called Boolean attributes) can simply be specified with no value. So, the aforementioned input element can be written as follows:
在HTML5中，可以简单地将“ on”或“ off”属性(称为布尔属性)指定为没有值。 因此，上述input元素可以编写为：
<input type="text" disabled>
Hence, HTML5 has very loose requirements for validation, at least as far as syntax is concerned. Does this mean you should just go nuts and use whatever syntax you want on any given element? No, we certainly don’t recommend that.
因此，⾄少就语法⽽⾔，HTML5对验证的要求⾮常宽松。 这是否意味着您应该疯了，并在任何给定元素上使⽤想要的任何语法？ 不，我们当然不建议这样做。
We encourage developers to choose a syntax style and stick to it—especially if you are working in a team environment where code maintenance and readability are crucial. We also recommend (though this is optional) that you choose a minimalist coding style while staying consistent.
我们⿎励开发⼈员选择并坚持使⽤语法样式，尤其是在团队环境中，其中代码维护和可读性⾄关重要时，尤其如此。 我们还建议(尽管这是可选的)您选择⼀种简约的编码样式，同时保持⼀致。
Here are some guidelines for you to consider using:
以下是供您考虑使⽤的⼀些准则：
Use lowercase for all elements and attributes as you would in XHTML.
像在XHTML中⼀样，对所有元素和属性使⽤⼩写字母。
Despite some elements not requiring closing tags, we recommend that all elements containing content be closed (as in <p>Text</p>).
尽管某些元素不需要关闭标签，但我们建议关闭所有包含内容的元素(如<p>Text</p> )。
Although you can leave attribute values unquoted, it’s highly likely that you’ll have attributes that require quotes (for example, when declaring multiple classes separated by spaces, or when appending a query string value to a URL). As a result, we suggest that you always use quotes for the sake of consistency.
尽管您可以保留属性值不带引号，但很有可能您将拥有需要⽤引号引起来的属性(例如，当声明多个⽤空格分隔的类时，或将查询字符串值附加到URL时)。 因此，为了保持⼀致，建议您始终使⽤引号。
Omit the trailing slash from void elements (such as meta or input).
省略void元素(例如meta或input )的结尾斜杠。
Avoid providing redundant values for Boolean attributes (for instance, use <input type="checkbox" checked> rather than <input type="checkbox" checked="checked">).
避免为布尔属性提供冗余值(例如，使⽤<input type="checkbox" checked>⽽不是<input type="checkbox" checked="checked"> )。
Again, these recommendations are by no means universally accepted; however, we believe that they’re reasonable syntax suggestions for achieving clean, easy-to-read maintainable markup.
同样，这些建议绝不是普遍接受的； 但是，我们认为它们是实现纯净，易于阅读的可维护标记的合理语法建议。
If you do run amok with your code style, including too much that’s unnecessary, you’re just adding extra bytes for no reason. You’re also potentially making your code harder to maintain, especially if you work with other developers on the same code base.
如果您确实使⽤代码样式运⾏amok，包括不必要的过多操作，则⽆缘⽆故地只是添加了额外的字节。 您还可能使代码难以维护，特别是如果您在同⼀代码库上与其他开发⼈员⼀起⼯作时。
The following is an extract from our book, , written by Alexis Goldstein, Louis Lazaris, and Estelle Weyl. Copies are sold in stores worldwide, or you can .
以下摘⾃Alexis Goldstein，Louis Lazaris和Estelle Weyl编写 》⼀书。副本在世界各地的商店中都有出售，或者您可以 。
html5常见问题

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。