-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
94e29e4
commit 656332d
Showing
3 changed files
with
106 additions
and
39 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,19 +1,69 @@ | ||
| <!DOCTYPE html> | ||
| <html lang="en"> | ||
| <head> | ||
| <meta charset="UTF-8"> | ||
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | ||
| <title>Java Learning Hub</title> | ||
| <link rel="stylesheet" href="styles.css"> | ||
| </head> | ||
| <body> | ||
| <header> | ||
| <h1>Welcome to the Java Learning Hub</h1> | ||
| </header> | ||
| <main> | ||
| <p>Learn Java programming with our interactive tutorials!</p> | ||
| <!-- Add more content here --> | ||
| </main> | ||
| <script src="script.js"></script> | ||
| </body> | ||
| </html> | ||
|
|
||
| <!-- Replace the text between the tags with your own information! --> | ||
|
|
||
| <!-- The <head> section contains the meta-information about your website, including title and links to stylesheets. --> | ||
| <head> | ||
| <title>Name Here</title> | ||
|
|
||
| <!-- Bootstrap CSS CDN – provides free CSS! (The container, header, and footer sections are all provided by Bootstrap.) --> | ||
| <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> | ||
|
|
||
| <!-- This links to our CSS file, which adds styling to the website. --> | ||
| <link rel="stylesheet" type="text/css" href="main.css"> | ||
|
|
||
| <!-- Font Awesome CDN – for icons for email and social media links. --> | ||
| <script src="https://use.fontawesome.com/44cb379512.js"></script> | ||
|
|
||
| <!-- Ignore the next few lines – they're just for Bootstrap. --> | ||
| <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries --> | ||
| <!-- WARNING: Respond.js doesn't work if you view the page via file:// --> | ||
| <!--[if lt IE 9]> | ||
| <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script> | ||
| <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> | ||
| <![endif]--> | ||
| </head> | ||
|
|
||
| <!-- The body contains the content of the website. --> | ||
|
|
||
| <body> | ||
|
|
||
| <!-- A div contains a "section" of the website. --> | ||
| <div class="container-fluid"> | ||
| <div class="header"> | ||
| <!-- h1 and h2 are header tags (meaning larger text, with h1 > h2). --> | ||
| <h1>NAME HERE</h1> | ||
| <h2>CATCHY TAGLINE</h2> | ||
| </div> | ||
| </div> | ||
|
|
||
| <footer class="footer"> | ||
| <div class="container"> | ||
| <div class="icons"> | ||
|
|
||
| <!-- a href indicates a link (here, to your email address). --> | ||
| <a href="mailto:<YOUR_EMAIL_HERE>"> | ||
| <!-- This is the icon for email. Since it's surrounded by the 'a' tag, it links to your email address! --> | ||
| <i class="fa fa-envelope" title="Email"></i> | ||
| </a> | ||
|
|
||
| <a href="https://github.com/<YOUR_GITHUB_HERE>"> | ||
| <i class="fa fa-github" title="Github"></i> | ||
| </a> | ||
|
|
||
| <a href="https://www.linkedin.com/in/<YOUR_LINKEDIN_HERE>"> | ||
| <i class="fa fa-linkedin" title="LinkedIn"></i> | ||
| </a> | ||
|
|
||
| </div> | ||
| </div> | ||
| </footer> | ||
|
|
||
| <!--You can ignore this stuff down here.--> | ||
| <!-- jQuery (necessary for Bootstrap's JavaScript plugins) --> | ||
| <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> | ||
| <!-- Bootstrap JavaScript CDN --> | ||
| <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script> | ||
| </body> | ||
| </html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,39 @@ | ||
| body { | ||
| text-align: center; | ||
| color: white; /* Text color. */ | ||
| font-family: 'Avenir', sans-serif; /* Font: sans-serif included in case browser doesn't support first option. */ | ||
| } | ||
|
|
||
| h1 { | ||
| font-size: 100px; | ||
| } | ||
|
|
||
| h2 { | ||
| font-size: 40px; | ||
| } | ||
|
|
||
| /* This just centers the header container vertically on the page. */ | ||
| .container-fluid { | ||
| height: 200px; | ||
| width: 100%; | ||
|
|
||
| position: absolute; | ||
| top:0; | ||
| bottom: 0; | ||
| left: 0; | ||
| right: 0; | ||
| margin: auto; | ||
| } | ||
|
|
||
| /* Styling for icons. */ | ||
| .fa { | ||
| color: white; | ||
| margin: 10px 5px; | ||
| font-size: 3em !important; | ||
| } | ||
|
|
||
| .footer { | ||
| position: absolute; | ||
| bottom: 0; | ||
| width: 100%; | ||
| } |