Today's Posts Follow Us On Twitter! TFL Members on Twitter  
Forum search: Advanced Search  
Navigation
Marketplace
  Members Login:
Lost password?
  Forum Statistics:
Forum Members: 24,254
Total Threads: 80,792
Total Posts: 566,471
There are 1930 users currently browsing (tf).
 
  Our Partners:
 
  TalkFreelance     Design and Development     HTML/XHTML/DHTML/CSS :

Where to start learning CSS?

Thread title: Where to start learning CSS?
Closed Thread    
    Thread tools Search this thread Display Modes  
11-30-2004, 04:52 AM
#1
TylerL is offline TylerL
TylerL's Avatar
Status: Sin Binner
Join date: Nov 2004
Location: Sudbury, Ontario
Expertise:
Software:
 
Posts: 270
iTrader: 0 / 0%
 

TylerL is on a distinguished road

Send a message via MSN to TylerL

  Old  Where to start learning CSS?

Last night I got a message from someone who wanted a design made (he had the picture, I had to remake it down to every cell padding), but he didn't realize that the design was done originally in CSS. Since he was offering a good amount of money for the design, I took a whack at it:

Code:
<html>
<head>
<style type="text/css">
td.top { border-style: solid; border-color: #B4B2B3; border-width: 1px 1px 1px 1px; background-image: url(DESIGN/gradient.gif); padding: 12px 4px 4px 5px }
td.left { border-style: solid; border-color: #B4B2B3; border-width: 0px 1px 0px 1px; background-color: #E3E1E2; padding: 11px 8px 8px 7px}
td.right { border-style: solid; border-color: #B4B2B3; border-width: 0px 0px 1px 0px; }
td.bottom { border-style: solid; border-color: #B4B2B3; border-width: 0px 1px 1px 1px; background-color: #E3E1E2; padding: 11px 9px 10px 0px}
td.add { border-style: solid; border-width: 1px 1px 1px 1px; border-color: #D4D2D3; background-color: #EDEBEC; padding: 7px 6px 6px 6px }
body,td,th {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
}
.style2 {font-size: 10}
.style3 {
	color: #3c8732;
	font-weight: bold;
}
</style>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Do***ent</title>
</head>

<body>
<div align="center">

<table width="700" cellpadding="0" cellspacing="0">
  <tr>
    <td cl***="top" colspan="2" height="53" valign="top">
	
	  <table width="100%" height="43" cellpadding="0" cellspacing="0">
	  
	      <td width="50%" valign="top">
		  
		        <span cl***="style2">Logged in as<strong> tombarry</strong><br>
	            <a href="#">Logout</a>
		        </span>
		  </td>
		  
	    <td width="50%">
		<div align="right">
		      <br>
	          <br>
	          System Status: <span cl***="style3">ok</span> 
	    </div>
		</td>
		
	  </table>
	  
	</td>
  </tr>
  <tr>
<td cl***="left" width="187"><p><strong>Home</strong><br>
  <br>
  Service Control<br>
  Rights Management<br>
  System Integrity<br>
  Settings<br>
  <br>
  Database Management<br>
  <br>
  Users<br>
  <br>
  Logout  <br>
  <br>
  <br>
</p>

  <div align="center">
  <table width="170">
    <tr>
      <td cl***="add">
	    <strong>Update Available
		</strong><br>
        <br>
        ???? has been released and is ready to be installed.<br>
        <br>
        <a href="#">Update Details </a></td>
    </tr>
  </table>
  </div>    <br></td>
<td cl***="right" width="511">&nbsp;</td>
  </tr>
  <tr>
    <td cl***="bottom" colspan="2" height="42"><div align="right">Powered by ????<br>
      Connected to main hub at ???? </div>
	</td>

  </tr>
</table>
</div>
</body>
</html>
Anyways, I really liked doing this and I know thats not even close to how much CSS there is to learn, and I wanted to know where I should start learning it? I've really been putting it off and I've been using Dreamweaver for everything, I figure this is my chance to learn to code clean and learn CSS at the same time!

Any sites that offer CSS tutorials are great. I already read alot at AListApart.com and a few other sites but I really need a beginners tutorial, sort of like a walkthrough.

Thanks,
Tyler

11-30-2004, 04:59 AM
#2
sliceandcode is offline sliceandcode
Status: Request a custom title
Join date: Aug 2004
Location: California
Expertise:
Software:
 
Posts: 1,004
iTrader: 0 / 0%
 

sliceandcode is on a distinguished road

  Old

Dreamweaver has some good stuff in it for using CSS. Hmm. I have some links here that could help you out.

http://www.spoono.com/csst/
http://www.tutorialized.com/tutorials/HTML/CSS/1
http://www.invano.com/?html
http://www.htmlgoodies.com/beyond/css.html
http://www.purephotoshop.com/browse....%20and%20Xhtml

Those are some good sites. Also, I would recommend using one of Dreamweaver's CSS template and looking through their code and seeing what everything does. That really helped me.

Good luck!

11-30-2004, 05:18 AM
#3
Nubs is offline Nubs
Status: Member
Join date: Jul 2004
Location:
Expertise:
Software:
 
Posts: 109
iTrader: 0 / 0%
 

Nubs is on a distinguished road

Send a message via AIM to Nubs Send a message via MSN to Nubs Send a message via Yahoo to Nubs

  Old

11-30-2004, 05:30 AM
#4
sliceandcode is offline sliceandcode
Status: Request a custom title
Join date: Aug 2004
Location: California
Expertise:
Software:
 
Posts: 1,004
iTrader: 0 / 0%
 

sliceandcode is on a distinguished road

  Old

Ah, good list Nubs. How could I have forgotten w3schools =\

11-30-2004, 06:30 AM
#5
TylerL is offline TylerL
TylerL's Avatar
Status: Sin Binner
Join date: Nov 2004
Location: Sudbury, Ontario
Expertise:
Software:
 
Posts: 270
iTrader: 0 / 0%
 

TylerL is on a distinguished road

Send a message via MSN to TylerL

  Old

Ah that's the site I was using (w3schools). Thanks Nightspy and Naveed

11-30-2004, 06:41 AM
#6
sliceandcode is offline sliceandcode
Status: Request a custom title
Join date: Aug 2004
Location: California
Expertise:
Software:
 
Posts: 1,004
iTrader: 0 / 0%
 

sliceandcode is on a distinguished road

  Old

Always glad to help a TFL'er out =]

12-01-2004, 07:46 AM
#7
nykoelle is offline nykoelle
nykoelle's Avatar
Status: Member
Join date: Nov 2004
Location: Poughkeepsie, NY
Expertise:
Software:
 
Posts: 163
iTrader: 0 / 0%
 

nykoelle is on a distinguished road

Send a message via Yahoo to nykoelle

  Old

12-01-2004, 08:01 AM
#8
pmoduk2 is offline pmoduk2
Status: Sin Binner
Join date: Nov 2004
Location:
Expertise:
Software:
 
Posts: 5
iTrader: 0 / 0%
 

pmoduk2 is on a distinguished road

  Old

Start with w3schools and work through the others. I haven't seen a better introduction to web languages anywhere else

Closed Thread    


Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)
 
Thread Tools
Display Modes

  Posting Rules  
Smilies are On
[IMG] code is On
HTML code is Off
Forum Jump:
 
  Contains New Posts Forum Contains New Posts   Contains No New Posts Forum Contains No New Posts   A Closed Forum Forum is Closed