Skip to content

Commit 064e6a3

Browse files
sdoransdoran
committed
Adding code for week4 mobile web@
1 parent 4cfbd59 commit 064e6a3

File tree

7 files changed

+105
-0
lines changed

7 files changed

+105
-0
lines changed

‎mobileWeb/week4/._notessarah

4 KB
Binary file not shown.

‎mobileWeb/week4/README.md

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
# Week 4 November 29th
2+
This week we focused on a couple of new css styles.
3+
4+
1. Padding
5+
- We added padding to our container div which created space between the
6+
border of our container div and the elements inside the container.
7+
2. Border
8+
- We experiemented adding different border types to our container
9+
e.g. *border: 5px dashed purple;*
10+
-- The first number is the width
11+
-- The second is the border type (dashed/solid/inset etc.)
12+
13+
3. Text styling
14+
- We learned how to add cool shadows to our heading
15+
-- *text-shadow: 10px 8px 6px purple;*
16+
--- The horizontal shadow (10px)
17+
--- The vertical shadow (8px)
18+
--- How much to blur the shadow (6px)
19+
--- The colour of the shadow (purple)
20+
21+
4. Side by side images
22+
- We learned how to put two images side by side.
23+
Remember: If the box the images are in is too small they won't fit
24+
beside each other!! (e.g. check the div the images are in!)
25+
26+
Hope you enjoyed styling your site!!

‎mobileWeb/week4/Thumbs.db

19 KB
Binary file not shown.

‎mobileWeb/week4/codergirl.jpg

12.6 KB
Loading

‎mobileWeb/week4/index.html

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
<html>
2+
3+
<head>
4+
<title>This is my first app</title>
5+
<link rel="stylesheet" type="text/css" href="style.css"/>
6+
</head>
7+
<body>
8+
<div id="container">
9+
<h1>CoderDojoGirls@DCU</h1>
10+
11+
<p class="whiteBg" id="para1">Welcome to the coolest place on the planet</p>
12+
13+
<h2>Be Cool</h2>
14+
<p class="whiteBg" id="para2">The only rule is be cool</p>
15+
16+
<div id="codergirl">
17+
<img src="codergirl.jpg">
18+
<img src="logo.png">
19+
</div>
20+
21+
</div>
22+
23+
</body>
24+
25+
</html>

‎mobileWeb/week4/logo.png

8.61 KB
Loading

‎mobileWeb/week4/style.css

Lines changed: 54 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,54 @@
1+
body{
2+
background-image: url(logo.png);
3+
background-repeat: repeat-x;
4+
padding-top: 70px;
5+
}
6+
7+
h1{
8+
color:#8271f5;
9+
text-shadow: 10px 8px 8px purple;
10+
}
11+
12+
h2{
13+
color:#f571e4;
14+
}
15+
16+
p#para1{
17+
color:#3f0760;
18+
font-size:12;
19+
font-family:Tahoma;
20+
}
21+
22+
p#para2{
23+
color:#0f0217;
24+
font-size:16;
25+
font-family:Georgia;
26+
}
27+
div#codergirl{
28+
width:90%;
29+
height:60%;
30+
}
31+
32+
.whiteBg {
33+
background-color: white;
34+
}
35+
36+
div#container {
37+
width: 80%;
38+
margin-left: auto;
39+
margin-right: auto;
40+
background-color: white;
41+
border: 5px dashed purple;
42+
padding: 5%;
43+
}
44+
45+
46+
47+
48+
49+
50+
51+
52+
53+
54+

0 commit comments

Comments
 (0)