Scribd
Upload
31 views4 pages

My First Website

Uploaded by

k_georgo
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
31 views4 pages

My First Website

Uploaded by

k_georgo
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 4

<html>

<head>

<title>My First Website</title>

<meta name="author" content="your name" />

<meta name="description" content="" />

<!-- you should always add your stylesheet (css) in the head tag so that it starts loading
before the page html is being displayed -->

<link rel="stylesheet" href="style.css" type="text/css" />

</head>

<body>

<div id="page">

<div id="logo">

<h1>My First Website</h1>

</div>

<div id="nav">

<ul>

<li><a href="#/home.html">Home</a></li>

<li><a href="#/about.html">About</a></li>

<li><a href="#/contact.html">Contact</a></li>

</ul>

</div>

<div id="content">

<h2>Home</h2>

<p>

This is my first webpage! I was able to code all the HTML


and CSS in order to make it. Watch out world of web design here I come!

</p>

<p>

I can use my skills here to create websites for my business,


my friends and family, my C.V, blog or articles. As well as any games or more experiment
stuff (which is what the web is really all about).

</p>
</div>

<div id="footer">

<p>

Webpage made by <a href="#">[your name]</a>

</p>

</div>

</div>

</body>

</html>

p{ line-height: 1em; }

h1, h2, h3, h4{

color: orange;

font-weight: normal;

line-height: 1.2em;}

h1{ font-size: 1.8em; }

h2{ font-size: 1.5em; }

a{

color: black;

text-decoration: none;}

a:hover, a:active{ text-decoration: underline; }

body{

font-family: arial; font-size: 80%; line-height: 1.2em; width: 100%; margin: 0; background:
#ddc;}
#page{ margin: 20px; }

#logo{

width: 35%;

margin-top: 5px;

font-family: georgia;

display: inline-block;}

#nav{

width: 60%;

display: inline-block;

text-align: right;

float: right;

#nav ul{}

#nav ul li{

display: inline-block;

height: 22px;

#nav ul li a{

padding: 20px;

background: orange;

color: white;

#nav ul li a:hover{

background-color: #ffb424;

#nav ul li a:active{ background-color: #ff8f00; }

#content{

margin: 30px 0;
background: white;

padding: 20px;

clear: both;

#footer{

border-bottom: 1px #ccc solid;

margin-bottom: 10px;

#footer p{

text-align: right;

text-transform: uppercase;

font-size: 80%;

color: grey;}

You might also like