HTML验证程序错误

我想让我的页面中的菜单看起来像这样：关于我们|联系人|地图。我有一个代码，它：HTML验证程序错误

<div id="headermenu"> 
    <ul> 
     <li> <a title="About us" href="index.php?id=about"><?php echo $meniu['about']; ?></a></li> | 
     <li> <a title="Contacts" href="index.php?id=contacts"><?php echo $meniu['contacts']; ?></a></li> | 
     <li><a title="Map" href="index.php?id=map"><?php echo $meniu['map']; ?></a> <img alt="map icon" src="images/map_icon.png" /></li> 
    </ul> 
</div>

然而，HTML验证不喜欢这个想法，并给我一个错误：“字符数据在这里不允许”，并建议删除|。但我不想！我该怎么办？

来源

2011-11-16 Lina

筛选和工作，利润率，使它看起来不错：

<div id="headermenu"> 
    <ul> 
     <li> <a title="About us" href="index.php?id=about"><?php echo $meniu['about']; ?></a></li> 
     <li>|</li> 
     <li> <a title="Contacts" href="index.php?id=contacts"><?php echo $meniu['contacts']; ?></a></li> 
     <li>|</li> 
     <li><a title="Map" href="index.php?id=map"><?php echo $meniu['map']; ?></a> <img alt="map icon" src="images/map_icon.png" /></li> 
    </ul>

来源

2011-11-16 00:58:13

设置列表的样式以使列表项目水平显示（例如display: inline-block;），并将其左侧或右侧边框设置为medium solid black。

ul { display: block; } 
li { display: inline-block; border-left: medium solid black; 
    padding: 0 1ex; margin: 0; /* some spacing is nice */ } 
li:first-child { border-left: none; }

ul元素内部不能有任何字符数据;那里只允许有li元素。所以删除这些栏。

来源

2011-11-16 00:56:18

也许尝试添加一个border-right到li元素。当然，最后的li并不需要它。

来源

2011-11-16 00:56:53

你可以把它放在里面<li>，因为验证器抱怨文本具有外面。

但是更好的解决方案可能是使用CSS制作垂直条，除了最后的<li>（给最后一个班级，因此您可以清除该边框设置）之外的所有设置右边框。

来源

2011-11-16 00:58:39 GregL

HTML验证程序错误

回答

相关问题