在 uni 做一个元素，我完全误读了简介，在我的元素中使用了 HTML5，并意识到我不允许这样做。糟糕!
我唯一的问题是，我曾尝试使用 div 将其转换为 XHTML Strict 1.0 标准，但这并不像我想的那么容易。
我只会发布导航部分，因为这是我需要帮助的部分，不需要所有额外的细节。
在我发帖之前 - 只是想澄清一下这个问题:
此代码符合 HTML5，我需要它符合 XHTML Strict 1.0，但我无法让 CSS 使用 div 代替导航功能。
代码如下:
<!DOCTYPE html>
<head>
<link rel="stylesheet" type="text/css" href="style\main.css" />
<title>Wessex Round Table of Investors</title>
</head>
<body>
<div id="whole">
<div id="header">
<img class="logo" src="images\wrtilogo.gif" alt="WRTI Logo" />
</div>
<div id="navbar">
<div id="container">
<nav id="menu">
<ul>
<li><a href="#">Home</a></li>
<li><a href="#">Link</a>
<ul>
<li><a href="#">Sublink</a></li>
<li><a href="#">Sublink</a></li>
<li><a href="#">Sublink</a></li>
<li><a href="#">Sublink</a></li>
</ul>
</li>
<li><a href="#">Link</a>
<ul>
<li><a href="#">Sublink</a></li>
</ul>
</li>
<li><a href="#">Link</a>
<ul>
<li><a href="#">Sublink</a></li>
</ul>
</li>
<li><a href="#">Link</a></li>
</ul>
</nav>
</div>
</div>
</div>
</body>
</html>
aaa 这是 CSS
div.whole {
margin-left: 15%;
margin-right: 15% }
div.header {
width: 100%; }
div.navbar {
position: absolute;
display: block;
width: 90%;
margin-left: auto;
margin-right: auto;
text-align: center }
img.logo {
display: block;
margin-left: auto;
margin-right: auto }
#content
#footer
#navigation {
width: 800px;
margin: 30px auto;
background: #fff;
box-shadow: 0 0 20px #8493A6;
overflow: auto;
}
nav#menu {
margin: 10px 30px 30px;
padding: 0;
border-bottom: 1px solid #ccc;
border-top: 1px solid #ccc;
text-align: center; /*this is the first bit that centers the menu*/
font: 100%/40px Verdana, Geneva, sans-serif
}
nav#menu ul {margin: 0;}
nav#menu ul li {
margin: 0;
padding: 0;
display: inline-block; /*this is the second bit that centers the menu*/
position: relative;
list-style: none;
background: #fff;
}
nav#menu ul li a {
padding: 1px 20px;
display: block;
font-size: 17px;
font-weight: 300;
color: #cc0000;
text-decoration: none;
}
nav#menu ul li:hover {background: #fff;}
nav#menu ul ul {
width: 160px;
margin: 0;
padding: 0;
position: absolute;
top: 42px;
left: -999px;
border: 1px solid #ccc;
border-radius: 3px 3px 3px 3px;
box-shadow: 0 0 0 transparent;
}
nav#menu ul li:hover ul { /*this bit centers the dropped ul relative to the parent li*/
margin: 0 0 0 -80px;
left: 50%;
}
nav#menu a:hover {color: #540000;}
最佳答案
通常，您在 HTML 中使用 ID，但样式基于类。
例如如果你要说
div.navbar {
...
}
这将适用于:
<div class="navbar">...</div>
不是
<div id="navbar">...</div>
关于css - 关于替代 <nav> 功能的想法 - 必须使用 XHTML Strict 1.0，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/16305580/