-
Notifications
You must be signed in to change notification settings - Fork 46
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
57 changed files
with
5,927 additions
and
6,342 deletions.
There are no files selected for viewing
Large diffs are not rendered by default.
Oops, something went wrong.
81 changes: 38 additions & 43 deletions
81
docs/content/learning-area/css/introduction-to-css/debugging-css-finished/index.html
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,46 +1,41 @@ | ||
| <!DOCTYPE html> | ||
| <html> | ||
|
|
||
| <head> | ||
| <meta charset="utf-8" /> | ||
| <title>CSS comprehension</title> | ||
| <link rel="stylesheet" href="style.css" /> | ||
| </head> | ||
|
|
||
| <body> | ||
| <header> | ||
| <h1>My imperfect page</h1> | ||
| </header> | ||
|
|
||
| <main> | ||
| <h2>My article</h2> | ||
|
|
||
| <img src="https://mdn.mozillademos.org/files/11947/ff-logo.png" alt="firefox logo" /> | ||
|
|
||
| <p> | ||
| Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer nec odio. Praesent libero. Sed cursus ante | ||
| dapibus diam. Sed nisi. Nulla quis | ||
| sem at nibh elementum imperdiet. Duis sagittis ipsum. Praesent mauris. Fusce nec tellus sed augue semper porta. | ||
| Mauris massa. Vestibulum lacinia | ||
| arcu eget nulla. | ||
| </p> | ||
|
|
||
| <ul> | ||
| <li>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</li> | ||
| <li>Integer nec odio. Praesent libero.</li> | ||
| <li>Sed cursus ante dapibus diam.</li> | ||
| </ul> | ||
|
|
||
| <p> | ||
| Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Curabitur sodales | ||
| ligula in libero. Sed dignissim | ||
| lacinia nunc. Curabitur tortor. Pellentesque nibh. Aenean quam. In scelerisque sem at dolor. | ||
| </p> | ||
| </main> | ||
|
|
||
| <footer> | ||
| <p>©1978 Chris' brain</p> | ||
| </footer> | ||
| </body> | ||
|
|
||
| <head> | ||
| <meta charset="utf-8" /> | ||
| <title>CSS comprehension</title> | ||
| <link rel="stylesheet" href="style.css" /> | ||
| </head> | ||
|
|
||
| <body> | ||
| <header> | ||
| <h1>My imperfect page</h1> | ||
| </header> | ||
|
|
||
| <main> | ||
| <h2>My article</h2> | ||
|
|
||
| <img src="https://mdn.mozillademos.org/files/11947/ff-logo.png" alt="firefox logo" /> | ||
|
|
||
| <p> | ||
| Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer nec odio. Praesent libero. Sed cursus ante dapibus diam. Sed nisi. Nulla quis | ||
| sem at nibh elementum imperdiet. Duis sagittis ipsum. Praesent mauris. Fusce nec tellus sed augue semper porta. Mauris massa. Vestibulum lacinia | ||
| arcu eget nulla. | ||
| </p> | ||
|
|
||
| <ul> | ||
| <li>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</li> | ||
| <li>Integer nec odio. Praesent libero.</li> | ||
| <li>Sed cursus ante dapibus diam.</li> | ||
| </ul> | ||
|
|
||
| <p> | ||
| Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Curabitur sodales ligula in libero. Sed dignissim | ||
| lacinia nunc. Curabitur tortor. Pellentesque nibh. Aenean quam. In scelerisque sem at dolor. | ||
| </p> | ||
| </main> | ||
|
|
||
| <footer> | ||
| <p>©1978 Chris' brain</p> | ||
| </footer> | ||
| </body> | ||
| </html> |
20 changes: 9 additions & 11 deletions
20
docs/content/learning-area/css/introduction-to-css/how-css-works/index.html
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,15 +1,13 @@ | ||
| <!DOCTYPE html> | ||
| <html> | ||
| <head> | ||
| <meta charset="utf-8" /> | ||
| <title>My CSS experiment</title> | ||
| <link rel="stylesheet" href="style.css" /> | ||
| </head> | ||
|
|
||
| <head> | ||
| <meta charset="utf-8" /> | ||
| <title>My CSS experiment</title> | ||
| <link rel="stylesheet" href="style.css" /> | ||
| </head> | ||
|
|
||
| <body> | ||
| <h1>Hello World!</h1> | ||
| <p>This is my first CSS example</p> | ||
| </body> | ||
|
|
||
| <body> | ||
| <h1>Hello World!</h1> | ||
| <p>This is my first CSS example</p> | ||
| </body> | ||
| </html> |
55 changes: 26 additions & 29 deletions
55
docs/content/learning-area/css/styling-boxes/advanced_box_effects/background-clip-text.html
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,35 +1,32 @@ | ||
| <!DOCTYPE html> | ||
| <html> | ||
| <head> | ||
| <meta charset="utf-8" /> | ||
| <title>CSS filters examples</title> | ||
| <style> | ||
| html { | ||
| font-family: impact, sans-serif; | ||
| } | ||
|
|
||
| <head> | ||
| <meta charset="utf-8" /> | ||
| <title>CSS filters examples</title> | ||
| <style> | ||
| html { | ||
| font-family: impact, sans-serif; | ||
| } | ||
| h2 { | ||
| width: 250px; | ||
| height: 250px; | ||
| text-align: center; | ||
| line-height: 250px; | ||
| font-size: 75px; | ||
| display: inline-block; | ||
| background: url(colorful-heart.png) no-repeat center; | ||
| } | ||
|
|
||
| h2 { | ||
| width: 250px; | ||
| height: 250px; | ||
| text-align: center; | ||
| line-height: 250px; | ||
| font-size: 75px; | ||
| display: inline-block; | ||
| background: url(colorful-heart.png) no-repeat center; | ||
| } | ||
|
|
||
| .text-clip { | ||
| -webkit-background-clip: text; | ||
| -webkit-text-fill-color: transparent; | ||
| } | ||
|
|
||
| </style> | ||
| </head> | ||
|
|
||
| <body> | ||
| <h2>WOW</h2> | ||
| <h2 class="text-clip">WOW</h2> | ||
| </body> | ||
| .text-clip { | ||
| -webkit-background-clip: text; | ||
| -webkit-text-fill-color: transparent; | ||
| } | ||
| </style> | ||
| </head> | ||
|
|
||
| <body> | ||
| <h2>WOW</h2> | ||
| <h2 class="text-clip">WOW</h2> | ||
| </body> | ||
| </html> |
Oops, something went wrong.