Skip to content

Commit def1d78

Browse files
basakestbasakest
committed
boxes
1 parent 08b8516 commit def1d78

27 files changed

+597
-0
lines changed

‎.DS_Store

0 Bytes
Binary file not shown.

‎10/foreground-color.html

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<title>foreground color</title>
5+
<style type="text/css">
6+
/* color name */
7+
h1 {
8+
color: DarkCyan;
9+
}
10+
/* hex code */
11+
h2 {
12+
color: #ee3e80;
13+
}
14+
/* rgb value */
15+
p {
16+
color: rgb(100, 100, 90);
17+
}
18+
</style>
19+
</head>
20+
<body>
21+
<h1>Marine Biology</h1>
22+
<h2>The Composition of Seawater</h2>
23+
<p>Almost anying can be found in seawater. This includes dissolved materials from Earth's crusl as well as materials released from organisms. The most important components of seawater that indluence life forms are salinity, temperature, dissolved gases (mostly oxygen and carbon dioxide), nutrients, and PH. These elements vary in their composition as well as in their influence on marine life.</p>
24+
</body>
25+
</html>

‎13/.DS_Store

8 KB
Binary file not shown.

‎13/border-color.html

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<title>border-color</title>
5+
<style type="text/css">
6+
p {
7+
width: 200px;
8+
border-style: solid;
9+
}
10+
p.one {
11+
border-color: #0088dd;
12+
}
13+
p.two {
14+
border-color: #bbbbaa #111111 #ee3e80 #0088dd;
15+
}
16+
</style>
17+
</head>
18+
<body>
19+
<p class="one">The ARP Odyssey was introduced in 1972.</p>
20+
<p class="two">The ARP Odyssey was introduced in 1972.</p>
21+
</body>
22+
</html>

‎13/border-image.html

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<title>border-image</title>
5+
<style type="text/css">
6+
p {
7+
width: 197px;
8+
height: 54px;
9+
border: 11px solid #ffffff;
10+
}
11+
p.one {
12+
-moz-border-image: url("images/dots.gif") 11 11 11 11 stretch;
13+
-webkit-border-image: url("images/dots.gif") 11 11 11 11 stretch;
14+
border-image: url("images/dots.gif") 11 11 11 11 stretch;
15+
}
16+
p.two {
17+
-moz-border-image: url("images/dots.gif") 11 11 11 11 round;
18+
-webkit-border-image: url("images/dots.gif") 11 11 11 11 round;
19+
border-image: url("images/dots.gif") 11 11 11 11 round;
20+
}
21+
</style>
22+
</head>
23+
<body>
24+
<p class="one"></p>
25+
<p class="two"></p>
26+
<p class="three"></p>
27+
</body>
28+
</html>

‎13/border-radius.html

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<title>border-radius</title>
5+
<style type="text/css">
6+
p {
7+
border: 5px solid #cccccc;
8+
padding: 20px;
9+
width: 275px;
10+
text-align: center;
11+
border-radius: 10px;
12+
-moz-border-radius: 10px;
13+
-webkit-border-radius: 10px;
14+
}
15+
</style>
16+
</head>
17+
<body>
18+
<p>Pet Sounds featured a number of unconventional instruments such as bicycle bells, buzzing organs, harpsichords, flutes, Electro-Theremin, dog whistles, trains, Hawaiian-sounding string instruments, Coca-Cola cans and barking dogs.</p>
19+
</body>
20+
</html>

‎13/border-shorthand.html

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<title>border</title>
5+
<style type="text/css">
6+
p {
7+
width: 250px;
8+
border: 3px dotted #0088dd;
9+
}
10+
</style>
11+
</head>
12+
<body>
13+
<p>Here is a simple chord sequence played on a Hammond organ through a Leslie speaker.</p>
14+
</body>
15+
</html>

‎13/border-style.html

Lines changed: 46 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,46 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<title>border-style</title>
5+
<style type="text/css">
6+
p {
7+
width: 200px;
8+
9+
}
10+
p.one {
11+
border-style: solid;
12+
}
13+
p.two {
14+
border-style: dotted;
15+
}
16+
p.three {
17+
border-style: dashed;
18+
}
19+
p.four {
20+
border-style: double;
21+
}
22+
p.five {
23+
border-style: groove;
24+
}
25+
p.six {
26+
border-style: ridge;
27+
}
28+
p.seven {
29+
border-style: inset;
30+
}
31+
p.eight {
32+
border-style: outset;
33+
}
34+
</style>
35+
</head>
36+
<body>
37+
<p class="one">Wurlitzer Electric Piano</p>
38+
<p class="two">Wurlitzer Electric Piano</p>
39+
<p class="three">Wurlitzer Electric Piano</p>
40+
<p class="four">Wurlitzer Electric Piano</p>
41+
<p class="five">Wurlitzer Electric Piano</p>
42+
<p class="six">Wurlitzer Electric Piano</p>
43+
<p class="seven">Wurlitzer Electric Piano</p>
44+
<p class="eight">Wurlitzer Electric Piano</p>
45+
</body>
46+
</html>

‎13/border-width.html

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<title>border-width</title>
5+
<style type="text/css">
6+
p {
7+
width: 200px;
8+
border-style: solid;
9+
}
10+
p.one {
11+
border-width: 2px;
12+
}
13+
p.two {
14+
border-width: thick;
15+
}
16+
p.three {
17+
border-width: 1px 4px 12px 4px;
18+
}
19+
</style>
20+
</head>
21+
<body>
22+
<p class="one">Hohner's "Clavinet" is essentially an electric clavichord.</p>
23+
<p class="two">Hohner's "Clavinet" is essentially an electric clavichord.</p>
24+
<p class="three">Hohner's "Clavinet" is essentially an electric clavichord.</p>
25+
</body>
26+
</html>

‎13/box-shadow.html

Lines changed: 48 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,48 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<title>box-shadow</title>
5+
<style type="text/css">
6+
p {
7+
width: 100px;
8+
height: 100px;
9+
background-color: #e1ddda;
10+
margin: 20px;
11+
display: inline-block;
12+
}
13+
p.one {
14+
-moz-box-shadow: -5px -5px #777777;
15+
-webkit-box-shadow: -5px -5px #777777;
16+
box-shadow: -5px -5px #777777;
17+
}
18+
p.two {
19+
-moz-box-shadow: 5px 5px 5px #777777;
20+
-webkit-box-shadow: 5px 5px 5px #777777;
21+
box-shadow: 5px 5px 5px #777777;
22+
}
23+
p.three {
24+
-moz-box-shadow: 5px 5px 5px 5px #777777;
25+
-webkit-box-shadow: 5px 5px 5px 5px #777777;
26+
box-shadow: 5px 5px 5px 5px #777777;
27+
}
28+
p.four {
29+
-moz-box-shadow: 0px 0px 10px #777777;
30+
-webkit-box-shadow: 0px 0px 10px #777777;
31+
box-shadow: 0 0 10px #777777;
32+
}
33+
p.five {
34+
-moz-box-shadow: inset 0 0 10px #777777;
35+
-webkit-box-shadow: inset 0 0 10px #777777;
36+
box-shadow: inset 0 0 10px #777777;
37+
}
38+
</style>
39+
</head>
40+
<body>
41+
<p class="one"></p>
42+
<p class="two"></p>
43+
<p class="three"></p>
44+
<br />
45+
<p class="four"></p>
46+
<p class="five"></p>
47+
</body>
48+
</html>

0 commit comments

Comments
 (0)