Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
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
28 changes: 14 additions & 14 deletions challenge-2.html
Original file line number Diff line number Diff line change
Expand Up @@ -12,50 +12,50 @@
/* Set the font-size to 20px */
font-size: 20px;
/* Change the line-height 1.5 */

line-height: 1.5;
/* Set the (foreground) color #eee */

color: #eee;
/* Set the background-color rgb(36, 36, 48) */

background-color: rgb(36,36,48);
}

/* The link is hard to read change the color */
/* Set the color of the anchor tag */
a {
/* Se the (foreground) color to #f0f */

color: #f0f;
/* Set the text-decoration to none */

text-decoration: none;
}

/* make the abbr stand out */
abbr {
/* Set the color to cyan */

color: cyan;
/* Set the text-decoration to underline */

text-decoration: underline;
/* Set the text-decoration-style to dotted */

text-decoration-style: dotted;
}

/* Style the header */
h1 {
/* color rgb(232, 224, 119) */

color: rgb(232, 224, 119);
/* font-weight lighter */

font-weight: lighter;
/* font-size 3em */

font-size: 3em;
}

/* maybe the small should not be so small */
small {
/* color #ccc */

color: #ccc;
/* font-weight lighter */

font-weight: lighter;
/* font-size 1em */

font-size: 1em;
}

/*
Expand Down
18 changes: 9 additions & 9 deletions challenge-3.html
Original file line number Diff line number Diff line change
Expand Up @@ -6,35 +6,35 @@
/* Style the blockquote */
blockquote {
/* make the font size large size : 2em */

font-size: 2em;
/* Use a serif font family : Georgia */

font-family: 'Georgia';
/* Needs some line space use 1.5 */

line-height: 1.5;
/* Set the color #777 medium gray */

color: #777;
/* Use text-align: right */

text-align: right;
}

/* Style the first letter */
/* Look at this selector it applies it's rules only to the first
letter of the blockaquote */
blockquote::first-letter {
/* Set the color #000 */

color: #000;
}

/* Style the author */
/* Look at this selector. The styles are only applied to footer
tags that are inside a blockquote */
blockquote footer {
/* Make the font smaller size 0.5em */

font-size: 0.5em;
/* Make the font bold */

font-weight: bold;
/* Change the color #666 */

color: #666;
}

/* Notice the styles above don't apply to the footer at the
Expand Down
30 changes: 18 additions & 12 deletions challenge-4.html
Original file line number Diff line number Diff line change
Expand Up @@ -9,39 +9,45 @@

/* Style the list use the selector: ul { ... your styles here... } */
/* Remove the bullet list-style none */

ul{
list-style: none;
}

/* Style the blockquote: blockquote { ... } */
/* make the font large 2em */
/* Set the font to a serif use Gerogia */
/* Needs some line height 1.5 */

blockquote{
font-size: large;
font-family: 'Georgia';
line-height: 1.5;
}
/* Here are some new selectors */

/* Even numbered list items */
li:nth-child(even) {
/* Set the color #775 */

color: #775;
/* Align the text to the right */

text-align: right;
}

/* These style will use some advanced selectors. */
/* You in this case you need to select only the */
/* odd numbered list items */
li:nth-child(odd) {
/* Set the color #757 */

color: #757;
/* Align the text to the left */

text-align: right;
}

/* Style the first letter */
blockquote::first-letter {
/* Set the color #000 */

color: #000;
/* Try changing the font size */

font-size: large;
}

/* Here you need to style the authors name. */
Expand All @@ -54,19 +60,19 @@
/* Style the author */
blockquote footer {
/* Make the font smaller 0.5em */

font-size: 0.5em;
/* Make the font weight bold */

font-weight: bold;
/* Change the color #666 */

color: #666;
}

/* Now style the footer at the bottom of the page */
/* This footer is a child of main. Use this selector: */
/* main > footer */
main > footer {
/* text align center */

text-align: center;
}

/* Stretch Challenges
Expand Down
21 changes: 17 additions & 4 deletions challenge-5.html
Original file line number Diff line number Diff line change
Expand Up @@ -12,26 +12,39 @@
/* line height 1.5 */
/* Color #333 dark gray */
/* background color #eee light gray */

body{
font-family: 'Helvetica Neue';
font-size: 20px;
line-height: 1.5;
color: #333;
background-color: #eee;
}

/* Style the dt (definition title) */
/* Make the font really big! 2em */
/* Make the background color light gray #ccc */

dt{
font-size: 2em;
background-color: #ccc;
}

/* Style the dd (definition) */
/* make the font big 1.5em */
/* Background color #ddd */
/* Remove the by setting margin: 0 */

dd{
font-size:1.5em;
background-color:#ddd;
margin: 0
}


/* Style both the dt and dd */
/* Using the comma groups selectors */
dt, dd {
/* Add some space between these elements and their content */
/* padding: 0.5em */

padding: 0.5em;
}

/* Stretch Challenges:
Expand Down
36 changes: 19 additions & 17 deletions challenge-6.html
Original file line number Diff line number Diff line change
Expand Up @@ -7,47 +7,48 @@
/* Add some styles */
body {
/* Font 'Helvetica Neue' */

font-family: 'Helvetica Neue';
/* Add some line height */

line-height: 1.5;
}

h1 {
/* Make the heading really big */

font-size: large;
/* Make the color #000 */

color: #000;
/* Make the font weight lighter font-weight: lighter */

font-weight: lighter;
}

/* Maybe the small text doesn't need to be so small */
/* Might be just lighter in color */
header > small {
/* font size 1.5em */

font-size: 1.5em;
/* Font weight bold */

font-weight: bold;
/* color light gray #999 */

color: #999;
}

/* Style the time in the header */
header > time {
/* make the font size 1.5em */

font-size: 1.5em;
/* make the fonr weight bold */

font-weight: bold;
/* Make the color #555 */

color: #555;
}

/* Style the list container */
/* Lets remove the bullets and padding */
footer ul {
/* list-style: none */

list-style: none;
/* Remove the padding on the list */
padding: 0;
/* This will get rid of the space on the left */
/* padding: 0 */

Expand All @@ -59,18 +60,19 @@
footer li {
/* Change the display from block to inline */
/* display: inline */

display: inline;
/* Make the font weight bold */

font-weight: bold;
/* Color #999 */

Color: #999;
}

/* Style the link */
a {
/* Color rgb(0, 145, 255) */

color: rgb(0,145,255);
/* Remove the underline */
text-decoration: none;
/* text-decoration: none */

}
Expand All @@ -79,7 +81,7 @@
/* The hover style applied when the cursor is over the element */
a:hover {
/* color rgb(0, 114, 201) */

color: rgb(0,114,201)
}

</style>
Expand Down
26 changes: 13 additions & 13 deletions challenge-8.html
Original file line number Diff line number Diff line change
Expand Up @@ -8,55 +8,55 @@
/* Style the fonts for the page */
body {
/* Se the font to 'Helvetica Neue' */

font-family: 'Helvetica Neue';
}

/* Style the preformatted blocks */
pre {
/* Give these some padding 1em */

padding: 1em;
/* Background color #eee */

background-color: #eee;
}

/* Style code examples */
code {
/* Set font family to 'Courier New' */

font-family: 'Courier New';
/* color rgb(3, 107, 199) */

color: rgb(3,107,199);
}

/* Style strong elements in code */
/* We'll use this to highlight important things */
code strong {
/* Font weight normal */

font-weight: normal;
/* add an underline text-decoration: underline */

text-decoration: underline;
/* make the underline wavy text-decoration-style: wavy */

text-decoration-style: wavy;
/* Give these a color so they stand out rgb(105, 40, 179) */

color: rgb(105,40,179);
}

/* This code has been edited. We should show the edits */
/* Select del tags that are descedents of code tags */
/* Style deleted text */
code del {
/* color red rgb(199, 72, 3) */

color: rgb(199,72,3);
/* strike through text-decoration-line: line-through */

text-decoration-line: line-through;
/* Lets make the line wavy */

text-decoration-style: wavy;
}

/* style inserted text */
/* Select ins tags that descendents of code tags */
code ins {
/* color green rgb(56, 140, 48) */

color: rgb(56,140,48);
}
</style>
</head>
Expand Down