HTML site development: div's vs ul's for navigation and menus

泪湿孤枕 提交于 2019-12-23 15:22:11

问题


I'm working on developing a Web 2.0 site, and I've been looking at how sites deal with menus and nav-bars. Many sites (like twitter) use UL's whereas sites such as stackoverflow use div's that are ID's containing links.

Is there an advantage to not using UL's other than it eliminates some IE bugs?

is there an advantage to using UL's?

Thanks!


回答1:


I personally use ul/li for all of my menu needs as it makes it clear to even an unstyled browser (Links for example) that it is a menu of some sort and that they are various links that lead to different parts on a website.

Not only that, but the markup is remarkably easy and allows for very interesting things to be done using ul, li, and a to make awesome menu's with CSS with various options, CSS sprite backgrounds.

Using divs makes this possible as well, but makes the intent less clear. With a browser that does proper CSS layout you won't notice a difference and the only one that will know is you and the user that does a view-source.

It may make a difference if you need to parse the dom using javascript, it may not...




回答2:


It depends on how you look at it, UL stands for unordered list. Putting things in a UL element is a semantic way of saying the elements children ( <li> ) are list items and therefore a logical group. Which gives the chunk of html more structure/meaning than just a bunch of div tags.

Is a menu a list? I think so. So if you can for something like this prefer the ul.

ul's can be more difficult to style with css, especially when the menu is horizontal.




回答3:


UL's are more friendly to screen-readers, and are a way to force you to keep the menu clean of other html. The li-tags can essentially be handled like divs, if you want that.

So basically the difference is that the ul-tag is a bit more specialized, but can deliver essentially the same thing as divs could.



来源:https://stackoverflow.com/questions/828453/html-site-development-divs-vs-uls-for-navigation-and-menus

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!