What is the best way to use CSS? (NOT *learn* but really *use*) -


i know css , i'm learning more , more common pattern. however, feel i'm hacking instead of doing right way.

for instance, people respect tell me using css reset unnecessary while others live it. also, there many great css framework (for grids, etc.) thought understand them, never know when use them.

so, basically, question is: once understand how css work, there recognized "best" approach used excellent web developer? in python, 1 should try use common pattern , read pep 8. or, in c++, after understanding syntax, reading effective serie meyer excellent "second" read.

sorry taking long explain.. didn't want have answer like: read "beginning css" explain how change background or how set font. i'm looking standard approach.

  • should use reset?
  • should use 1 file per site? 1 homepage , 1 rest? 1 basic file , once different every big sections?
  • is bad have 2k+ css files? mean should have been refactored , contain duplicate?
  • should define parent @ top normal font, color, h1, etc., , then, when it's different change per sections.. or instead use standard 1 , redefine each , every section.
  • should use .class , #id little bit everywhere, or should try minimize them , instead use long descriptor such as:
   .content .main tr td span    or   span.classname  

thank you!

tl/dr:

what's best "second" read once understand css use in clean/professional way?

[edit]

thanks answer. know asked quite lot of questions.. examples real question is: best "second" read once understand css use in clean/professional way. i.e., hoping read book explaining examples proposed.. explain lots of other things aren't css-syntax more css-best-professional-use.

people have range of answers these questions, here approaches take:

resetting

if you're working on fragile layout -- 1 break if few pixels aren't expect them -- consider using reset. normalize.css. instead of overwriting browser defaults, smooths out differences between browsers.

you consider resetting specific elements if find adding lot of margin: 0; stylesheets.

splitting css documents

classes , ids or long chains of selectors?

i try keep classes , ids minimum (in both html , css). tend more fragile when you're building pages others update wysiwyg editors. add few ids or classes large blocks of page, use css target specific elements within blocks. easier if avoid deep nesting in html as possible.

working css preprocessor such less or sass can write more readable stylesheets. ability nest style rules in both less , sass has helped me avoid lot of specificity-related issues.

still, specificity css topic familiar with:

additional resources

as far additional reading concerned...


Comments

Popular posts from this blog

apache - Add omitted ? to URLs -

redirect - bbPress Forum - rewrite to wwww.mysite prohibits login -

php - How can I stop spam on my custom forum/blog? -