Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Pr/1 #5

Open
wants to merge 4 commits into
base: master
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
58 changes: 58 additions & 0 deletions Autumn.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,58 @@
<!DOCTYPE html>
<html>
<head>
<title>Autumn</title>
<link rel="stylesheet" href="styles.css">
<style>
h1{color: black;
text-align: top;

width:150px; height: 100px;
margin:30px;
padding: 5px;
font-family:Snell Roundhand, cursive;
font-size:70px

}
h2{
color: white;
font-family:Snell Roundhand, cursive;
}


.container {
position: relative;
}


.text-block {
position: absolute;
bottom: 20px;
right: 20px;
color: white;
padding-left: 20px;
padding-right: 20px;
}
</style>


</head>
<body>


<div class="container">
<img src="/Users/danielhellsten/Documents/GitHub/DanHell4/city-finland-night-596740.jpg" alt="Norway" height="1380"width="1380" >
<div class="text-block">
<h1 style="color:white; text-align:center">Autumn</h1>
<h2>Finnish autumn is relatively long. The summer pretty much ends in
August and there are three long months before winter really starts.
Autumn can be a good time to visit Finland, but to be completely honest,
October and November are the darkest months of the whole year.</h2>
</div>
</div>



<div class="topright"></div>
</body>
</html>
Binary file added Issue.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
19 changes: 19 additions & 0 deletions README 2.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,19 @@
# Project 0

Web Programming with Python and JavaScript
<!DOCTYPE html>

Doing the project was challenging. Mostly challenging because I linked four other HTML pages I made to my website. What's on the Stylesheet: I included links to four of my linked HTML pages inside Tables it was difficult to find the right structure so that the pages looked logical and not messy. The links are in the titles Summer, Fall, Winter and Spring.
Four other HTML pages provide information on the rich biodiversity of my country, Finland. Ordered list starts with "The nature cycle" but has a nesting Unordered list inside. Inheritange can also be found inside List's, beginning with "The nature cycle" and "The eight seasons are divided ...".
The image can be found next to the Tables on the left.
Mobile responsive @ media I put features that change the page's green background color to blue when the page is reduced.
As CSS selectors I used the #Id -selector (found in the phrase "Four seasons in Finland"), the Placeholder -selector can be found in the bottom left corner of the page (your favorite number), the Class -selector can be found in many places, also inside the #Id selector (class = "Hometown")
The Hover -selector can be found in Button, the X -selector I used in Table inside links pointing to four other HTML pages (Summer, Fall, Winter, Spring) the title color is blue.
For CSS properties I used Font-Family, Font-Size, Font-Weight, Background -color, Border (table 3px).
A SCSS -variable I used the ordered list (color-yellow) and the unordered list (Color: yellow). I added 2 columns of two Bootstraps, one of which I placed a list (beginning with "The nature cycle.") And the title: "The people of eight seasons."
inside the other I put a column called "The eight seasons" and a list (starts: ordered list - Spring), found in stylesheets: div.col-sm, div.col and .img-responsive.
As a bootstrap component I used Additional content, found in the sentence: In Everyday language. Additional content can be found at stylesheet -.alert-heading {font-family: Snell Roundhand, cursive;}.

I tried to fill all project requirements. Now that I'm done, I'm going to rest a bit. Writing to code for this project many overnight is already starting to feel like, but what you can do when it's just so much fun. If any shortcomings are found, would you please kindly give me feedback.

Yours Daniel Hellsten
Loading