Page 1 of 1

Working with HTML/CSS...

Posted: Wed Jul 15, 2009 9:32 pm
by Dr.CSS
When we answer questions about HTML/CSS a lot of us use Firefox with some addons, one I use the most and develop templates with is the Web Developers Toolbar between this and viewing the source of the page it is amazing how quick you can learn to change your sites look...

Once installed I go to CSS drop down in toolbar and click Edit CSS, I then move it to the left side of my browser, here you will see all the style sheets attached to your template, have fun, go thru them and make all kinds of changes and see what effects what, you can even go to other sites and play with them, nothing you do in it will make any permanent changes, but once you like what you see you can copy/paste it into your style sheet...

EDIT: This is directed more to the person who hasn't a lot of experience in HTML/CSS so something like the Firebug addon may not be as clear to them as Web Dev tool bar...

Re: Working with HTML/CSS...

Posted: Thu Jul 16, 2009 11:06 pm
by viebig
Great post mark!

I also use Firebug(http://getfirebug.com/) along with Web Developer Toolbar.

Also, if you guys have any css issues that you just can solve, try others sources before cmsms forum. A great start is asking on the irc channel #css at freenode.

Regards

G

Re: Working with HTML/CSS...

Posted: Mon Oct 19, 2009 2:06 pm
by Stom
Also useful: Colorzilla and MeasureIt, a colour picker and on-screen ruler. Both very handy when tweaking your css.

Re: Working with HTML/CSS...

Posted: Wed May 12, 2010 11:42 pm
by pkbowen
I just wanted to point out that Opera has had a pretty comprehensive code inspector installed since approx. v9.1.  To access it, simply go to the 'developer tools' menu and click on Opera Dragonfly (http://www.opera.com/dragonfly/).

Re: Working with HTML/CSS...

Posted: Sun Jul 22, 2012 3:01 pm
by HoofArted
I'd just like to add that Chrome users may appreciate the F12 key when inspecting the code... :)

Re: Working with HTML/CSS...

Posted: Tue Aug 21, 2012 7:08 pm
by Dr.CSS
To make one from scratch go to layout > templates and click Add New Template link, it will fill with the most basic needed to make one, for existing templates replace the menu stuff with {menu} and where the content is add {content} otherwise you need to read all the default content, link in my signature...