<html>
<met charset="utf-8">
<head>
<link rel="stylesheet" type="text/css" href="File CSS/HTML5 Style.css">
<title>HTML 5</title>
</head>
<body>
<p>This is the body element</p>
<section>
<p>Section</p>
<header>
<p>Header</p>
<img src="Angkorea.jpg" width="100%">
</header>
<nav>
<p>Navigation</p>
<div style="text-align:center; font-size:30px;">
<span class="home">ទំព័រដើម</span> |
<span class="product">ផលិតផល</span> |
<span class="contact">ទំនាក់ទំនង</span> |
<span class="About">អំពី</span>
<img src="asd.jpg" width="96%" height="70%">
</nav>
<article>
<p>Article 01</p>
</article>
<article>
<p>Article 02</p>
</article>
<footer>
<p>©Copyright 2016 Footer</p>
</footer>
</body>
</html>
External Code
External Code
@import url(https://fonts.googleapis.com/css?family=Moul);
.home {font-family: 'Moul', cursive; color:blue;}
.product {font-family: 'Moul', cursive; color:red;}
.contact {font-family: 'Moul', cursive; color:blue;}
.about {font-family: 'Moul', cursive; color:red;}
body
{
font-family; "Lucida Sans Unicode", "Lucida Grande", sans-serif;
font-size:12px;
max-width:960px;
margin:0 auto;
}
header, nav, footer,article
{
display:block;
padding:5px 5px 5px 5px;
margin:5px;
color:#fff;
}
section { background-color:#999; padding:5px; color:#fff;}
header { background-color:#ccc;}
article { float:right; width:25%; background-color:#f3d14f;}
nav { float:left; width:70%; background-color:#ccc; margin-top:5px; height:350px;}
footer { clear:both; background-color:#ccc; margin-top:5px;}
No comments:
Post a Comment