关于css:这个HTML标签究竟是做什么的?

what exactly does this HTML tag do?

实际上我有一个源代码与我,我完全理解除了下面的代码,所以请为我提供这个标签的正确解释。
就是这样

1
<html lang="en" class="no-js">

在该计划中

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
<html lang="en" class="no-js">
<head>
<meta charset="UTF-8"/>
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
Circular Navigation - Interactive Demo | Codrops
<meta name="description" content="Circular Navigation Styles - Building a Circular     Navigation with CSS Transforms | Codrops"/>
<meta name="keywords" content="css transforms, circular navigation, round navigation,     circular menu, tutorial"/>
<meta name="author" content="Sara Soueidan for Codrops"/>
<link rel="shortcut icon" href="../favicon.ico">
<link rel="stylesheet" type="text/css" href="css/main.css"/>
<script src="js/vendor/modernizr-2.6.2.min.js">
</head>
<body>


<ul>


<li>
<span class="icon-picture"></span>
</li>


<li>
<span class="icon-headphones"></span>
</li>


<li>
<span class="icon-home"></span>
</li>


<li>
<span class="icon-facetime-video"></span>
</li>


<li>
<span class="icon-envelope-alt"></span>
</li>


</ul>


List items are positioned absolutely. Anchor tags inside them are also positioned absolutely, and their size is given so that they are visible at the end of     the      transformation. Red dot represents the container's center.
<button class="play-button">Start Demo</button>
<button class="step-button">Next Step</button>
<button class="reset-button" disabled>Reset</button>
<span>*Best experienced in Chrome</span>
<ul class="info">

<li>
List Item
</li>


<li>
Nav Container
</li>


<li>
Anchor inside List Item
</li>


<li>
Container center
</li>


</ul>


<span>Back to the Codrops Article</span>

<script src="js/vendor/jquery-1.10.1.min.js">
<script src="js/main.js">
</body>
</html>


来自MDN:

The HTML Element (or HTML root element) represents the root of an HTML or XHTML document. All other elements must be descendants of this element.

正如@Buch所说,lang属性表示页面内容所使用的语言,而class属性与任何其他元素的类属性一样。您展示的那个通常在诸如modernizr之类的javascript库进行功能检查时使用,因此在您的JavaScript中,您可以检查body标签上是否存在不同的类,以确定当前浏览器支持哪些功能。

- 编辑 -
对于语言,W3.org解释了各种语言代码:http://www.w3.org/TR/html401/struct/dirlang.html#h-8.1.1在你的情况下en代表英语。


这个给你:

html - 标签告诉浏览器这是一个HTML文档,它代表HTML文档的根。它是所有其他HTML元素的容器

lang - 告诉内容包含哪种语言

class - 定义样式表中使用的css类。

想要补充一点,我发现,"no-js"类是由modernizr(http://modernizr.com/docs/)使用的。它的确切功能可以在这里阅读:http://alistapart.com/article/taking-advantage-of-html5-and-css3-with-modernizr

Next, add the class"no-js" to the element:

When Modernizr runs, it will replace that class with the class"js"
which allows you to know, in your CSS, whether or not JavaScript is
enabled. But Modernizr doesn’t stop there: It will add classes for
every feature it detects, prefixing them with"no-" if the browser
doesn’t support it. So, your element will look something like
this upon pageload (providing JavaScript is enabled):

1
2
3
4
5
<html class="js canvas canvastext no-geolocation rgba hsla multiplebgs
borderimage borderradius boxshadow opacity cssanimations csscolumns
cssgradients cssreflections csstransforms csstransforms3d
csstransitions video audio localstorage sessionstorage webworkers
applicationcache fontface"
>

参考:http://www.w3schools.com/tags/tag_html.asp


"HTML lang属性可用于声明网页的语言或网页的一部分。这是为了帮助搜索引擎和浏览器。"
英语 - en
(来自http://www.w3schools.com/tags/ref_language_codes.asp)

"Modernizr特征检测库使用no-js类。当Modernizr加载时,它用js替换no-js。如果JavaScript被禁用,则类保持不变。这允许你编写容易针对这两种条件的CSS。"
(来自@ Zach_L的回答HTML"no-js"类的目的是什么?)


http://www.w3schools.com/tags/ref_language_codes.asp for lang ="en"

HTML"no-js"类的目的是什么? for class ="no-js"(class属性的主要用途是用作css或脚本语言中的选择器)


html标签包装任何html页面。 Lang是用于指定内容所在语言的属性,class是用于在CSS或jQuery中选择标记的类属性。