Folosirea instrumentelor

Instrumente de editare, legături și tabele în HTML

1. Folosirea instrumentelor Copiere, Decupare, Lipire pentru a copia text și imagini

Instrumentele de copiere, decupare și lipire sunt esențiale pentru manipularea conținutului într-o pagină web. Acestea pot fi realizate ușor prin utilizarea comenzilor din browser sau aplicații de editare HTML.

Copiere: Se poate copia text sau imagini selectându-le și utilizând comanda Ctrl+C.
Decupare: Se poate decupa text sau imagini folosind comanda Ctrl+X.
Lipire: După copiere sau decupare, conținutul se poate lipi într-un alt loc utilizând comanda Ctrl+V.

2. Realizarea unei legături pe un text

Legăturile (linkurile) sunt folosite pentru a naviga între pagini sau către diverse resurse online. Iată cum să creezi o legătură pe un text:

Cod HTML pentru legătură pe text:

<a href="https://www.example.com">Click aici pentru a vizita Example</a>

În acest exemplu, <a> definește legătura și atributul href specifică adresa URL de destinație.

3. Realizarea unei legături pe o imagine

Legătura pe o imagine este similară cu legătura pe un text, doar că în loc de text se folosește o imagine.

Cod HTML pentru legătură pe imagine:

<a href="https://www.example.com"><img src="imagine.jpg" alt="Exemplu imagine"></a>

În acest caz, imaginea este inserată într-o legătură, iar utilizatorul va fi redirecționat către URL-ul specificat la clic pe imagine.

Exemplu de legătură pe o imagine.

4. Maparea unei imagini

Maparea unei imagini presupune crearea unor zone active pe imagine care pot fi folosite pentru a naviga către diferite linkuri.

Cod HTML pentru mapare de imagine:

<img src="imagine.jpg" usemap="#mapa">
<map name="mapa">
    <area shape="rect" coords="34,44,270,350" href="pagina1.html" alt="Pagina 1">
    <area shape="circle" coords="450,300,50" href="pagina2.html" alt="Pagina 2">
</map>

În acest exemplu, usemap se folosește pentru a lega imaginea de o hartă definită cu <map> și <area>.

5. Inserarea unui tabel

Tabelele sunt folosite pentru a organiza informațiile într-un mod structurat. Iată cum să creezi un tabel în HTML:

Cod HTML pentru tabel:

<table>
  <tr><th>Coloana 1</th><th>Coloana 2</th></tr>
  <tr><td>Datele 1</td><td>Datele 2</td></tr>
</table>

Aici, eticheta <table> creează tabelul, <tr> definește rândurile, <th> creează celulele de antet, iar <td> creează celulele de date.

Coloana 1	Coloana 2
Datele 1	Datele 2

6. Formatarea tabelului

În HTML, tabelul poate fi formatat pentru a arăta mai atractiv, folosind CSS pentru a ajusta aspectul acestuia.

Exemplu de formatare a tabelului cu CSS:


table {
    width: 100%;
    border-collapse: collapse;
}
th, td {
    border: 1px solid #ddd;
    padding: 8px;
    text-align: left;
}
th {
    background-color: #4CAF50;
    color: white;
}

Prin aplicarea acestor stiluri, tabelul va avea o margine clară, rândurile de antet vor fi evidențiate cu un fundal verde, iar datele vor fi prezentate într-un mod mai clar și mai ordonat.