What is an appropriate list of HTML elements that one should style in an site's CSS?
When designing the base styles for a site, one should strive to address all of the different HTML elements that could come into use. This is especially true when developing a skin for a CMS where the admin's WYSIWYG editor might introduce elements you hadn't planned on (strong, em, strike... etc).
What is a list of HTML elements that any reasonably comprehensive stylesheet should address?
I'm assuming this is in a situation where you either can't rely on browser defaults or are using a reset style sheet.
The answer I'm looking for is either an existing resource or article where somebody seems to solve this. Or, a CMS theme that does a particularly good job of handling a variety of elements.
I supposed we could also build a definitive list h开发者_如何学Pythonere if those resources don't exist or are inconsistent.
Notes
1) This may belong in community wiki, and I'll move it there if that's the consensus. However, I believe this is a specific problem with a concrete answer.
2) Almost wanted to move this to Doctype, but I don't think this is a design question. It's a development question.
3) This isn't about when and why you should use an element but about what elements you should be prepared to handle.
Always use Semantic HTML, use CSS alternative of all deprecated elements
See this article
http://www.xstandard.com/en/articles/wysiwyg-editors-and-bad-markup/
and This Article Series can be helpful for you.
http://www.punkchip.com/2007/02/css-deprecated-attributes-1/
http://www.punkchip.com/2007/02/css-deprecated-attributes-2/
http://www.punkchip.com/2007/03/css-deprecated-attributes-3/
some more articles
http://www.wait-till-i.com/2005/09/20/wysiwyg-cms-the-other-user-agent/
http://css-tricks.com/list-of-depreciated-elements-still-in-widespread-use/
Edit
I found this editor useful. all available HTML elemnts in this Editor can be styled
https://apps.carleton.edu/opensource/loki/demo/
So, if I've got this right, you want to design a style sheet for public/generic use, where you don't know the specifics of the site it's being used on, right?
I would say that there's no definite answer, just a general (and loose) consensus. (So, I'd vote for Community Wiki")
OK, here's my theories:
- BODY: background, and general font size and typeface.
- H1,H2,H3 etc.
- TABLE, THEAD, TBODY, TR, TD: Since users should not be using them for layout, make it look like a table.
- OL/UL, LI
- INPUT elements
- HR
- DD/DT: maybe, but since they are so rarely used for their intended purpose, it hard to come up with a non-specific style.
And that's about it. DIV/SPAN/P don't really need a specific style beyonds what's in BODY (and if the end user put something in a DIV it probably because he has his own styling plans for it)
UPDATE: I guess a more closer question is, "What HTML elements have an expected look, which can be created in CSS?" In that case, we have:
- a (a:hover a:active, a:visited etc)
- b /strong
- big
- blockquote
- code
- dd/dt
- i / em
- uo/ol/li
- s / strike
- small
- pre
- sub
- sup
- tt
精彩评论