Blocuri

Fiecare element HTML are o valoare de afișare implicită, în funcție de ce tip de element este.

Cele două valori afișate sunt: bloc și linie interioară.

Un element la nivel de bloc pornește întotdeauna pe o nouă linie și ocupă toată lățimea disponibilă (se întinde spre stânga și spre dreapta, pe cât posibil).

Un astfel de bloc este un div.

Div

Div-ul este unul dintre cele mai folosite elemente ale HTML-ului, probabil chiar cel mai întâlnit. Un cod la nivel profesionist arată așa:

Ce este div-ul? Div-ul is an element which divises the web page.

Tag-ul <div> este utilizat că un container pentru elemente HTML - care este apoi stilat cu CSS sau manipulată cu JavaScript.

Span-uri

Tag-ul <span> este un container inline utilizat pentru a marca o parte a unui text sau o parte a unui document.

Tagul <span> nu oferă modificări vizuale de la sine, însă atunci când este marcată, o puteți stila cu CSS sau o puteți manipula cu JavaScript.

<span> este adesea folosit atunci când dorim să modificăm doar o anumită parte dintr-un paragraf, heading, etc.

Exerciții

1. Creați 3 div-uri apoi atribuiți-le clasele numite “div-unu”, “div-doi” și “div-trei”. Lăsăți spațiu între cele trei div-uri de câte două break line-uri. Adăugați în fiecare div textul “Acesta este un div”.

Soluţie

Soluţie


2. În clasa div-unu adăugați un border de 3 px outset red și culoarea de fundal aliceblue. În clasa div-doi modificați culoarea de fundal astfel încât să fie #000000 iar textul să aibă culoarea #ffffff. În clasa div-trei creați un border de 3px de culoare orange, apoi aliniați textul pe centru.

Soluţie

Soluţie


3. Creați clasa “subliniere” apoi adăugați propritatea de decorație a textului cu valorea subliniere. Utilizând span-uri atribuiți clasa fiecărui cuvânt “div” din fiecare paragraf cuprins de div-uri.

Soluţie

Soluţie


4.Scrieți cuvântul ROGVAIV într-un singur paragraf astfel încât

Soluţie

Soluţie


5.Downloadati imaginea de mai jos. Adăugați-o în folder, apoi creați un div. Adăugați imaginea în div, apoi plasați un link pe ea care să ducă la https://www.facebook.com

Soluţie

Soluţie


You could leave a comment if you were logged in.