Skip to content

Commit ed1e8de

Browse files
basakestbasakest
committed
introducing css
1 parent 355832e commit ed1e8de

10 files changed

+170
-0
lines changed

‎.DS_Store

0 Bytes
Binary file not shown.

‎10/cascade.html

+40
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,40 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<title>How CSS rules cascade</title>
5+
<style type="text/css">
6+
* {
7+
font-family: Arial, Verdana, sans-serif;
8+
}
9+
h1 {
10+
font-family: "Courier New", monospace;
11+
}
12+
i {
13+
color: green;
14+
}
15+
i {
16+
color: red;
17+
}
18+
b {
19+
color: pink;
20+
}
21+
p b {
22+
color: blue !important;
23+
}
24+
p b {
25+
color: violet;
26+
}
27+
p#intro {
28+
font-size: 100%;
29+
}
30+
p {
31+
font-size: 75%;
32+
}
33+
</style>
34+
</head>
35+
<body>
36+
<h1>Potatoes</h1>
37+
<p id="intro">There are <i>dozens</i> of different <b>potato</b> varieties.</p>
38+
<p>They are usually described as early, second early and maincrop potatoes.</p>
39+
</body>
40+
</html>

‎10/css-selectors.html

+28
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<title>CSS Selectors</title>
5+
</head>
6+
<body>
7+
<h1 id="top">Kitchen Garden Calendar</h1>
8+
<p id="introduction">Here you can read our handy guide about what to do when.</p>
9+
<h2>Spring</h2>
10+
<ul>
11+
<li><a href="mulch.html">Spring mulch vegetable beds</a></li>
12+
<li><a href="potato.html">Plant out early potatoes</a></li>
13+
<li><a href="tomato.html">Sow tomato seeds</a></li>
14+
<li><a href="beet.html">Sow tomato seeds</a></li>
15+
<li><a href="succhini.html">Sow zucchini seeds</a></li>
16+
<li><a href="rhubarb.html">Deadhead rhubarb flowers</a></li>
17+
</ul>
18+
<p class="note">
19+
This page written by
20+
<a href="mailto:[email protected]">
21+
[email protected]</a> for
22+
<a href="http://www.example.org">Example</a>.
23+
</p>
24+
<p>
25+
<a href="#top">Top of page</a>
26+
</p>
27+
</body>
28+
</html>

‎10/css/example.css

+9
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
body {
2+
font-family: Arial, Verdana, sans-serif;
3+
}
4+
h1, h2 {
5+
color: #ee3e80;
6+
}
7+
p {
8+
color: #665544;
9+
}

‎10/css/styles.css

+7
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
body {
2+
font-family: arial;
3+
background-color: rgb(185,179,175);
4+
}
5+
h1 {
6+
color: rgb(255,255,255);
7+
}

‎10/example.html

+13
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<title>Introducing CSS</title>
5+
<link href="css/example.css" type="text/css" rel="stylesheet" />
6+
</head>
7+
<body>
8+
<h1>From Garden to Plate</h1>
9+
<p>A <i>potager</i> is a French term for an ornamental vegetable or kitchen garden ...</p>
10+
<h2>What to Plant</h2>
11+
<p>Plants are chosen as much for their functionality as for their color and form ...</p>
12+
</body>
13+
</html>

‎10/inheritance.html

+25
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<title>inheritance</title>
5+
<style type="text/css">
6+
body {
7+
font-family: Arial, Verdana, Sans-serif;
8+
color: #665544;
9+
padding: 10px;
10+
}
11+
.page {
12+
border: 1px solid #665544;
13+
background-color: #efefef;
14+
padding: inherit;
15+
}
16+
</style>
17+
</head>
18+
<body>
19+
<div class="page">
20+
<h1>Potatoes</h1>
21+
<p>There are dozens of different potato varieties.</p>
22+
<p>They are usually described as early, second early and maincrop potatoes.</p>
23+
</div>
24+
</body>
25+
</html>

‎10/test.html

+18
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<title>This is a test</title>
5+
<style type="text/css">
6+
p~h1 {
7+
color: blue;
8+
}
9+
</style>
10+
</head>
11+
<h1>This is a h1</h1>
12+
<h1>This is a h1 which before p element</h1>
13+
<p>And this is a p element</p>
14+
<h1>This is a h1 which behind p element</h1>
15+
<h1>This is a h1 which behind p element</h1>
16+
<h3>h3</h3>
17+
<h1>This is a h1 which behind p element</h1>
18+
</html>

‎10/using-external-css.html

+11
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<title>Using External CSS</title>
5+
<link href="css/styles.css" type="text/css" rel="stylesheet" />
6+
</head>
7+
<body>
8+
<h1>potatoes</h1>
9+
<p>There are dozens of different potato varieties. They are usually described as earl, second early and maincrop.</p>
10+
</body>
11+
</html>

‎10/using-internal-css.html

+19
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<title>Using Internal CSS</title>
5+
<style type="text/css">
6+
body {
7+
font-family: arial;
8+
background-color: rgb(185,179,175);
9+
}
10+
h1 {
11+
color: rgb(255,255,255);
12+
}
13+
</style>
14+
</head>
15+
<body>
16+
<h1>Potatoes</h1>
17+
<p>There are dozens of different potato varieties. They are usually described as early, second early and maincrop.</p>
18+
</body>
19+
</html>

0 commit comments

Comments
 (0)