My Community

Tutorial 1 CSS Background Color

ChrisRansom

  • *********
  • 466
  • Christopher Michael Ransom The 1 and only.
    • View Profile
    • Draft Utopia
    • Email
Tutorial 1 CSS Background Color
« on: August 20, 2014, 01:57:07 PM »
There are lots of things you can do with CSS.  Today I'm going to focus strictly on the background color.

body {
             background-color: brown;
}

Save this document as mud.css
 
My name is Chris Ransom and I am the creator of Draft Utopia.  I run the podcast, website, and forum for Draft Utopia.

ChrisRansom

  • *********
  • 466
  • Christopher Michael Ransom The 1 and only.
    • View Profile
    • Draft Utopia
    • Email
Re: Tutorial 1 CSS Background Color
« Reply #1 on: August 20, 2014, 01:59:21 PM »
Remember this from Monday?  Well now we will apply the css style sheet into the file.

<html>
<head>
<title>Manziel</title>
<link rel="stylesheet" type="text/css" href="mud.css" />
</head>
<body>

<h1>Johnny Football's Bar and Grill</h1>

<h2>Johnny Manziel</h3>

<h3>First freshman to win Heisman.</h3>

<h4>moneyfingers</h4>

<h5>Cleveland Browns</h5>

<h6>bitch please</h6>

<p>Johnny Football&#146;s Bar and Grill is located in Arlington, TX.  For more information call Jerry Jones personal hotline.</p>
</body>
</html>

If you do this right the screen should turn brown.
My name is Chris Ransom and I am the creator of Draft Utopia.  I run the podcast, website, and forum for Draft Utopia.

ChrisRansom

  • *********
  • 466
  • Christopher Michael Ransom The 1 and only.
    • View Profile
    • Draft Utopia
    • Email
Re: Tutorial 1 CSS Background Color
« Reply #2 on: August 20, 2014, 02:00:37 PM »
There are lots of things you can do with CSS.  Today I'm going to focus strictly on the background color.

body {
             background-color: brown;
}

Save this document as mud.css
 

Now replace the background-color brown with any other color or your favorite color.  Save it as a .css document attach that document like this in your html page.

<link rel="stylesheet" type="text/css" href="mud.css" />
My name is Chris Ransom and I am the creator of Draft Utopia.  I run the podcast, website, and forum for Draft Utopia.

WilliamJeffersonKeleher

  • *****
  • 122
  • Will Keleher The Future CEO of Draft Utopia
    • View Profile
Re: Tutorial 1 CSS Background Color
« Reply #3 on: August 20, 2014, 04:46:10 PM »
so if I do.

body {
           background-color: yellow;
}

Save it as lemonade.css

Attach it to an html document
People call me Will Keleher the Kid That Sells Stuff In His Jacket during school.  I deal crayons and color pencils over the internet.  I'm not a crack dealer living in my mothers basement like Koolguy.

ChrisRansom

  • *********
  • 466
  • Christopher Michael Ransom The 1 and only.
    • View Profile
    • Draft Utopia
    • Email
Re: Tutorial 1 CSS Background Color
« Reply #4 on: August 25, 2014, 03:15:02 PM »
That would work Will.
My name is Chris Ransom and I am the creator of Draft Utopia.  I run the podcast, website, and forum for Draft Utopia.

WilliamJeffersonKeleher

  • *****
  • 122
  • Will Keleher The Future CEO of Draft Utopia
    • View Profile
Re: Tutorial 1 CSS Background Color
« Reply #5 on: August 25, 2014, 05:54:15 PM »
Cool thanks Chris.  Keep up the great work with the tutorials.
People call me Will Keleher the Kid That Sells Stuff In His Jacket during school.  I deal crayons and color pencils over the internet.  I'm not a crack dealer living in my mothers basement like Koolguy.