New to DW, need CSS Help/Advice

[liri_stargazer]

Hello, all!

I am new to DW and am trying to tweak the coding on my page. I did quite a bit of tweaking to my journal on LJ and I understood how to do that because I understand standard HTML and how to structure the commands/code.

However, DW is CSS and I know absolutely nothing about CSS or layers. I am not afraid to get into the basic code and change things to see what happens as I do it. I oddly love coding so I like to learn and build on my knowledge as I go.

At this point I want to do a simple tweak of the Title and Subtitle. I want to change font and probably color.
Currently I am using Abstractia.

My questions are:
1. Is there a basic tutorial or how-to that will walk me through where to find the code I need to modify?
2. Does anyone know of any basic online CSS tutorials that will help me learn what I need to do?

Thanks in advance for any help,
Liri

Comments

[vae]

I can't help with DW specific CSS, but for an intro to CSS in general or tutorials, try W3 Schools or Code Academy - both free.

[dreamwriters]

It's incomplete since the class discontinued, but
The style-making class posts may also a useful starting place.

[momijizukamori]

If you're relatively new to coding, I'd suggest starting out with picking up the CSS, before going digging around in the underlying S2 code that generates all the CSS/HTML, because you can do quite a lot with CSS on DW layouts and it's a lot faster to write out and test changes in, and far less likely to get really screwed up. We've got a whole bunch of CSS guides and resource links on the wiki here, but my go-to for checking stuff is using the developer tools in my browser - in Firefox, you can open them up with Control + Shift + Q or right-clicking and picking 'Inspect Element', and looks like Chrome has the same thing except the keyboard shortcut is Control + Shift + I. It's really handy because you can opt to select an element and have where it is in the HTML source highlighted, along with what CSS rules apply to it, or select something in the HTML source and have it be highlighted in the rendered page. You can also change values in the CSS in the inspector to see what it does - they're only visible to you, and temporary, so if it goes all wonky, just refresh and try something else.