Creați un plug simplu de pe site-ul în HTML, jnetclass - școală de dezvoltare web

In timp ce este creat site-ul nostru, puteți crea un capac temporar, folosind un cod html obișnuit.

Pentru capac avem nevoie de o imagine în jpg, png sau gif, poziția în dosarul „imagini“, fișier index.html, fișierul stilul style.css. Ambele l-am găsit sunt foarte simplu pentru a programa Notepad sau Notepad ++. Așa că am pregătit un shablonchik aceste fișiere. În cazul în care nu trebuie să le creeze le trebuie doar să descărcați aici. Pentru a înțelege site-ul HTML vă va ajuta htmlbook.ru. Există o mulțime de lecții foarte accesibile pentru incepatori, prin care puteți afla cu ușurință elementele de bază ale HTML.

un fișier index.html

Iată conținutul:

Un fișier și dosar imagini style.css

corp font-family: Arial, Verdana, sans-serif; / * * Font Familie /






font-size: 11pt; / * Dimensiunea fontului principal la punctele * /
background-color: # f0f0f0; / * Culoarea de fundal a paginii web * /
Culoare: # 333; / * Culoarea textului principal * /
>
h1 text-align: center;
Culoare: # a52a2a; / * Antet * Culoare /
font-size: 24pt; / * Dimensiunea fontului în puncte * /
font-family: Georgia, Times, serif; / * * Font Familie /
font-weight: normal; / * Text * marca Media /
margin-left: 100px; / * Stânga medalion în pixeli * /
marja de-dreapta: 100px; / * Dreapta încorporabilă în pixeli * /
>
p text-align: center; / * Pe alinierea la centru * /
margin-left: 100px; / * Stânga medalion în pixeli * /
marja de-dreapta: 100px; / * Dreapta încorporabilă în pixeli * /

padding-left: 10px; / * Offset de la linia din stânga a textului * /
padding-bottom: 10px; / * Offset de la linia de jos la textul * /
>

block1 <
lățime: 800px; / * Lățimea containerului, în pixeli * /
fundal: #fff; / * Umplere recipient de culoare * /
padding: 5px; / * Offset la conținutul containerului margine în * /
margin-left: auto; / * Offset la stânga containerului - vă permite să aliniați centrul * /
marja de-dreapta: auto; / * Offset la stânga containerului - vă permite să aliniați centrul * /

Acum, încercați pe baza acestor fișiere pentru a crea coperta, încărcați-l la găzduirea și arată prin trimiterea unui link către acesta.