Skip to content

Commit befa28f

Browse files
slavomir-ziakslavomir-ziak
committed
init
0 parents  commit befa28f

12 files changed

+839
-0
lines changed

‎css/_template.html

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
<html>
2+
<head>
3+
<style type="text/css">
4+
5+
6+
</style>
7+
</head>
8+
9+
<body>
10+
11+
</body>
12+
</html>

‎css/article.html

Lines changed: 121 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,121 @@
1+
<html>
2+
<head>
3+
<style type="text/css">
4+
body {
5+
font-family: sans-serif;
6+
}
7+
8+
.wrapper {
9+
/* min-width: 560px; */
10+
width: 600px;
11+
margin: auto;
12+
/* background-color: green; */
13+
overflow: hidden;
14+
height: 500px;
15+
padding: 10px 10px;
16+
}
17+
18+
.image {
19+
background-image: url('react.jpg');
20+
background-size: 200px 137px;
21+
background-repeat: no-repeat;
22+
height: 137px;
23+
width: 220px;
24+
margin: auto;
25+
float: left;
26+
margin-right: 20px;
27+
}
28+
29+
.content {
30+
float: right;
31+
/*background-color: yellow; */
32+
width: 60%;
33+
}
34+
35+
.content > h1 {
36+
font-weight: 900;
37+
}
38+
39+
.content > p {
40+
font-size: 15px;
41+
}
42+
43+
44+
.top-anchor, .continue-link {
45+
color: rgb(45, 113, 104);
46+
}
47+
48+
.rating {
49+
color: rgb(200, 200, 200);
50+
51+
}
52+
53+
.top-anchor, .rating {
54+
font-style: italic;
55+
}
56+
.star {
57+
display: inline-block;
58+
background-image: url('star.png');
59+
background-size: 14px 14px;
60+
background-repeat: no-repeat;
61+
height: 14px;
62+
width: 14px;
63+
}
64+
65+
.subtitle-info {
66+
background-color: rgb(240, 240, 240);
67+
font-style: italic;
68+
}
69+
70+
.continue-link {
71+
float: right;
72+
}
73+
74+
.continue-link:after {
75+
content: ')';
76+
text-st
77+
}
78+
.continue-link:before {
79+
content: '(';
80+
}
81+
82+
83+
</style>
84+
</head>
85+
86+
<body>
87+
<div class="wrapper" >
88+
89+
<div class="image" ></div>
90+
91+
<div class="content">
92+
93+
<div class="top-anchors">
94+
<span class="top-anchor">Articles</span> \
95+
<span class="top-anchor">Web roundups</span> \
96+
<span class="rating">Rating: </span>
97+
<span class="star"></span>
98+
<span class="star"></span>
99+
<span class="star"></span>
100+
<span class="star"></span>
101+
</div>
102+
103+
<h1>20 JavaScript Frameworks Worth Checking out</h1>
104+
105+
<span class="subtitle-info">Siddharth on Sep 23rd 2011 with 44 comments</span>
106+
107+
<p>Today we're going to take a look at fragments. This will teach you the beginning process of converting designs to HTML and CSS.Today we're going to take a look at fragments.</p>
108+
109+
110+
<p>converting designs to HTML and CSS.Today we're going to take a look at fragments. This will teach you the beginning process of converting designs to HTML and CSS.Today we're going to take a look at fragments. This will teach you the beginning process of converting designs to HTML and CSS.</p>
111+
112+
113+
<a class="continue-link" href="#">Continue</a>
114+
115+
116+
</div>
117+
118+
119+
</div>
120+
</body>
121+
</html>

‎css/layout.html

Lines changed: 60 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,60 @@
1+
<html>
2+
<head>
3+
<style type="text/css">
4+
body {
5+
/*font-family: sans-serif;*/
6+
}
7+
8+
.wrapper {
9+
min-width: 500px;
10+
width: 80%;
11+
margin: auto;
12+
background-color: green;
13+
overflow: hidden;
14+
}
15+
.content, .menu {
16+
height: 500px;
17+
}
18+
.content {
19+
float:left;
20+
background-color: red;
21+
width:80%;
22+
}
23+
.sidebar {
24+
float: left;
25+
background-color: brown;
26+
width: 20%;
27+
}
28+
29+
ul {
30+
list-style: none;
31+
padding-left: 0;
32+
}
33+
34+
</style>
35+
</head>
36+
37+
<body>
38+
<div class="wrapper" >
39+
40+
<h1>My Second Website</h1>
41+
42+
<div class="content" >
43+
<h1>Main Content Heading</h1>
44+
This is my blog
45+
</div>
46+
47+
<div class="sidebar">
48+
<h1>Sidebar</h1>
49+
<ul>
50+
<li>Menu</li>
51+
<li>Cuntent</li>
52+
<li>About</li>
53+
</ul>
54+
</div>
55+
56+
57+
58+
</div>
59+
</body>
60+
</html>

‎css/positioning.html

Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
<html>
2+
<head>
3+
<style type="text/css">
4+
.wrapper {
5+
position: relative;
6+
width: 70%;
7+
height: 300px;
8+
margin: auto;
9+
background-color: silver;
10+
11+
}
12+
13+
.red {
14+
position: absolute;
15+
bottom: -30px;
16+
right: 30;
17+
background-color: red;
18+
width: 100;
19+
height: 100;
20+
21+
}
22+
23+
24+
</style>
25+
</head>
26+
27+
<body>
28+
<div class="wrapper">
29+
<div class="red"></div>
30+
</div>
31+
</body>
32+
</html>

‎css/program.html

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
<html>
2+
<head>
3+
4+
<script src="program.js" ></script>
5+
6+
<style type="text/css">
7+
#main {
8+
max-width: 900px;
9+
margin: 0 auto;
10+
background-color: red;
11+
}
12+
13+
</style>
14+
</head>
15+
<body>
16+
<div id="main">a</div>
17+
</body>
18+
</html>

0 commit comments

Comments
 (0)