立即在html标签下的div标签的合法性 [英] legality of div tag immediately under html tag

查看:140
本文介绍了立即在html标签下的div标签的合法性的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我运行 lynx 来测试一些我必须做的HTML,因为考虑到可访问性。我猜想,如果在Lynx看起来很漂亮,屏幕阅读器,蹩脚的手机和其他东西的整个范围都可以,即使是最古老的硬件也行。

在某些情况下,我使用快捷方式的情况下,我想一次性清除所有静态HTML,以支持和启用JS的常规情况,包括将所有静态HTML标记嵌套到标识的 div

后来我意识到导致了我的 lynx 编译中的行为改变:

 <!DOCTYPE html> 
< html lang =en-US>
< head>
< meta name = viewport content =width = device-width>
< title>标题< / title>
< / head>
< body>
< div id =whatever>
< header>
< h1>第一个标题< / h1>
< / header>
< main>
< p>
Lorem ipsum dolor sit amet,consectetur adipiscing elit,sed do
eiusmod tempor incididunt ut labore et dolore magna aliqua。
< / p>
< / main>
< footer>
< hr />
< p>
页脚。
< / p>
< / footer>
< / div>
< / body>
< / html>

浏览(在





在我的本地主机的WebKit软件中显示时,无法捕捉到任何行为差异。



我应该放弃<为了标准,兼容性和可访问性,立即在 body 标记下使用code> div 标记;以更大的开发成本和更大的下载成本为代价?

我的Lynx编译错误吗? p>

我的WebKit编译错误吗?

解决方案

通过插入一个 div ,lynx考虑创建一个隐含的部分,使得 h1 为该部分的标题,而不再是网页的标题。



您应该注意,替换< div id =whatever> < main id =whatever> 给出了预期的结果。


I was running lynx to test some HTML I had to do, because having accessibility in mind. I guessed that, if looked pretty in Lynx, the whole range of screen readers, crappy phones and other stuff would do OK, even most ancient hardware.

In some cases I was using a shortcut in case I wanted to wipe out all static HTML at a once for the regular case of when JS is supported and enabled, consisting in nesting all the static HTML tags in an identified div tag to be wiped out.

Later I realized that caused a behavior change in my lynx compilation:

<!DOCTYPE html>
<html lang="en-US">
  <head>
    <meta name=viewport content="width=device-width">
    <title>Title</title>
  </head>
  <body>
    <div id="whatever">
      <header>
        <h1>First heading</h1>
      </header>
      <main>
        <p>
          Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do
          eiusmod tempor incididunt ut labore et dolore magna aliqua.
        </p>
      </main>
      <footer>
        <hr />
        <p>
          Footer.
        </p>
      </footer>
    </div>
  </body>
</html>

Browsing that (in http://driedleav.es/so_20170729/with_div_inside.html too) moves the first header to full left:

Browsing this other, in http://driedleav.es/so_20170729/without_div_inside.html too, centers the first header:

<!DOCTYPE html>
<html lang="en-US">
  <head>
    <meta name=viewport content="width=device-width">
    <title>Title</title>
  </head>
  <body>
    <header>
      <h1>First heading</h1>
    </header>
    <main>
      <p>
        Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do
        eiusmod tempor incididunt ut labore et dolore magna aliqua.
      </p>
    </main>
    <footer>
      <hr />
      <p>
        Footer.
      </p>
    </footer>
  </body>
</html>

Am unable to catch any difference in behavior when displaying it in the WebKit software of my local host.

Should I give up the div tag used immediately under the body tag for the sake of standard, compatibility, and accesibility; at the cost of larger to develop, and larger to download, JS code?

Is my Lynx compilation buggy?

Are my WebKit compilations buggy?

解决方案

By inserting a div, lynx considers the creation of an implicit section which makes the h1 the title of the section, and no longer the title of the webpage.

You should note that replacing the <div id="whatever"> with <main id="whatever"> gives the expected result.

这篇关于立即在html标签下的div标签的合法性的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆