AgerNic.com/ro
WEB DEVELOPER SITE, HTML, CSS, PHP, SQL
Tutorial

HTML ?abloane gratis pentru site
Ce este un - ?ablon -?
?ablon HTML este o baza sau chiar scheletul de la care se porneste un website.
Aspectele sunt foarte importante pentru orice site web. O dispunere corect? va oferi un aspect mai bun paginii dvs. de web ?i, de asemenea, aspectul dvs. ar trebui s? fie mobil prietenos (receptiv).

Exemplu sablon cu antet, doua coloane si o baza fluide.

  

<!DOCTYPE html>
<html lang="en">
<head>
<title>CSS Template</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
* {
box-sizing: border-box;
}

body {
font-family: Arial, Helvetica, sans-serif;
}

/* Style antet*/
header {
background-color: #666;
padding: 10px;
text-align: left;
font-size: 28px;
color: white;
height: 80px;
}

/* Crea?i dou? coloane / c?su?e fluide unul lāng? cel?lalt */
nav {
float: left;
width: 30%;
height: 300px; /* numai pentru demonstra?ie, trebuie īndep?rtat */
background: #ccc;
padding: 20px;
color: #006699;
text-decoration: none;
font-weight: bold;
}

/* Style lista din meniu */
nav ul {
list-style-type: none;
padding: 0;
line-height: 22px;
text-decoration: none;
color: #006699;
}

article {
float: left;
padding: 20px;
width: 70%;
background-color: #f1f1f1;
height: 300px; /* numai pentru demonstra?ie, trebuie īndep?rtat */
}

/* Clear floats after the columns */
section:after {
content: "";
display: table;
clear: both;
}

/* footer */
footer {
background-color: #777;
padding: 10px;
text-align: center;
color: white;
}

@media (max-width: 600px) {
nav, article {
width: 100%;
height: auto;
}
}
</style>
</head>
<body>

<header>
Numele site-ului web <br />
<span style="color:#990033; font-size:14px; font:"Courier New", Courier, monospace"><strong>Model sablon HTML gratis, free download</strong></span></header>

<section>
<nav>
HTML Links
<ul>
<li><a href="https://www.agernic.com/ro/html/paragraf-exemple.php">HTML Paragraf Exemple</a></li>
<li><a href="https://www.agernic.com/ro/html/comentarii.php">Comentarii in HTML Exemple</a></li>
<li><a href="https://www.agernic.com/ro/html/images.php">HTML Imagini</a></li>

<li><a href="https://www.agernic.com/ro/html/form.php">HTML Form</a></li>
<li><a href="https://www.agernic.com/ro/html/buton-onclick-link.php">HTML Buton Onclick Link</a></li>
<li><a href="https://www.agernic.com/ro/html/div-tag.php">HTML Div</a></li>

</ul>

</nav>

<article>
<h2> HTML Layout exemple gratis</h2>
<p> Īn acest sablon exemplu, am creat un antet, dou? coloane / cutii ?i o baza. Pe ecranele mai mici, coloanele se vor stivui una peste alta. </p>
<h3>Sabloane HTML exemple responsive</h3>
<p> Redimensiona?i fereastra browserului pentru a vedea efectul receptiv (ve?i afla mai multe despre acest lucru īn capitolul urm?tor - HTML Responsive.) </p>
</article>
</section>

<footer>
<p>Footer</p>
</footer>

</body>
</html>

Tags: HTML ?abloane, gratis, site responsive

Online Editor
ONLINE EDITOR

news templates


COLOR PICKER

news templates
This tool makes it easy to create, adjust, and experiment with custom colors for the web.


HTML Templates
news templates
Magnews2 is a modern and creative free magazine and news website template that will help you kick off your online project in style.


CSS HTML Layout
news templates
Find here examples of creative and unique website layouts.


Free CSS HTML Menu
news templates
Find here examples of creative and unique website CSS HTML menu.


Online Editor
ONLINE EDITOR

news templates


COLOR PICKER

news templates
This tool makes it easy to create, adjust, and experiment with custom colors for the web.


HTML Templates
news templates
Magnews2 is a modern and creative free magazine and news website template that will help you kick off your online project in style.


CSS HTML Layout
news templates
Find here examples of creative and unique website layouts.


Free CSS HTML Menu
news templates
Find here examples of creative and unique website CSS HTML menu.


analytics piwika