HTML to CSS?

wererich

New Member
Is it possible to take an HTML page (just a basic page) and convert it to a CSS page easily? If so, how would I do this?

Thanks!
 

jnjc

New Member
css (Cascading Style Sheet) just holds the style information for elements within your page, for example:


<div style="width:200px;background-color:black;color:white">
blah </div>

Could be handled like this:

<div id="divExample"> blah </div>

In the .css file:

#divExample {
width:200px;
background-color:black;
color:white
}


So the quick answer to your question is yes. That said there are a lot of different ways to define styles in your css etc. So I recommend doing a google on some CSS tutorials before you start.
 

c)solutions

New Member
Also dont forget to place this line in your head:
<link rel="stylesheet" href="style.css" type="text/css">

The style.css is the file that contains your style information.

I wouldnt use id's but classes, so:
<div class="divExample"> blah </div>

In the .css file:

.divExample {width:200px; background-color:black; color:white}

If you will combine your site with a microsoft .net application it could messy.
 

AlphanetChrisC

New Member
Heh, not sure exactly what you mean. Html is just tagging, css is the design. Looking up tutorials, I'm sure lynda.com will show you the difference.
 

starteasy

New Member
I think you would be completely insane to convert a html page to CSS, not that you can truly accomplish that task, but...

CSS is for appearance, and HTML is the shell. HTML loads the appearance of the site through CSS just the same as it loads images, movies or flash files and inserts them into the page.

You can however alter the td tags for your html (or table tags) and replace them with div tags, but I certainly wouldn't suggest an attempt until you master the simple CSS attributes. You can insert a background, or an image, font styles, colours, borders etc. You would obviously still need the html to load the CSS either as a "<link rel..." attribute, "class" or "style" attribute in a html tag eg. <p class="text"> text </p>.

An excellent resource for me was the W3C website. I wrote down all the CSS attributes from there, and use them as a reference. Saves a LOT of time and I have never actually needed to debug my CSS pages.

Good luck with your project.

John
 

webdesignideas

New Member
Actually, I think what he means is he wants to convert his formatting from HTML to CSS. Tables, Fonts, Colors, etc. Right?

I use Dreamweaver to do this when I need to.

If you highlight the formatted text in the preview pane and change the font, size and color to default, it will take the formatting off form the text. Then you can change the Dreamweaver settings to use CSS instead of HTML formatting. Now when you change fonts and colors it will create a style class instead of adding <font ...> tags.

For positioning - tables to DIVs, etc, this will need to be done manually.
 
Top