Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

formatting pass #13

Closed
wants to merge 1 commit into from
+11 −3
Closed

formatting pass #13

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
14 changes: 11 additions & 3 deletions README.md
View file
Original file line number Diff line number Diff line change
@@ -1,14 +1,22 @@
# Making The Web Look Good With CSS

We've learned a bit about HTML. While HTML does a great job of putting words and pictures on the page, CSS exists to make your content _look good_.
We've learned a bit about HTML. While HTML does a great job of putting words
and pictures on the page, CSS exists to make your content _look good_.

![Make This Look Good](https://web-dev-readme-photos.s3.amazonaws.com/js/make-this-look-good.gif)

Let's take a look at a rather simple example of what CSS does. Go ahead and flip between the HTML and CSS tabs of the CodePen below. You'll see the HTML sections has just a simple header: `<h1>This Is My Header</h1>`. The text turns up red though. How is that possible? The magic of CSS is how. Click on the CSS tab. You'll notice we set the color to red with this line: `color: red`. If you change the `red` to `green` what happens? It turns green! BOOM You just wrote your first CSS. Congrats!
Let's take a look at a rather simple example of what CSS does. Go ahead and
flip between the HTML and CSS tabs of the CodePen below. You'll see the HTML
sections has just a simple header: `<h1>This Is My Header</h1>`. The text turns
up red though. How is that possible? The magic of CSS is how. Click on the CSS
tab. You'll notice we set the color to red with this line: `color: red`. If you change
the `red` to `green` what happens? It turns green! BOOM You just wrote your first
CSS. Congrats!

<iframe height='265' scrolling='no' title='EWozNm' src='//codepen.io/joemburgess/embed/EWozNm/?height=265&theme-id=0&default-tab=html,result&embed-version=2&editable=true' frameborder='no' allowtransparency='true' allowfullscreen='true' style='width: 100%;'>See the Pen <a href='http://codepen.io/joemburgess/pen/EWozNm/'>EWozNm</a> by Joe Burgess (<a href='http://codepen.io/joemburgess'>@joemburgess</a>) on <a href='http://codepen.io'>CodePen</a>.
</iframe>

Now that you understand the basics of CSS, continue onto the next lesson and get a deeper understanding of CSS.
Now that you understand the basics of CSS, continue onto the next lesson and
get a deeper understanding of CSS.

<p class='util--hide'>View <a href='https://learn.co/lessons/styling-with-css-intro'>Styling With Css Intro</a> on Learn.co and start learning to code for free.</p>