HTML ID
Utilizarea etichetei id:
Eticheta ID specific? un id unic pentru un element HTML (valoarea trebuie s? fie unic? în documentul HTML).
Valoarea ID poate fi folosit? de CSS ?i JavaScript pentru a efectua anumite sarcini pentru elementul cu valoarea specific? de id.
În CSS, pentru a selecta un element cu un id specific, scrie?i un caracter hashtag (#), urmat de id-ul elementului:
Not?: Valoarea ID este sensibil? la litere mari ?i mici.
Not?: valoarea ID trebuie s? con?in? cel pu?in un caracter ?i s? nu con?in? spa?iul alb (spa?ii, file etc.).
<element id = "denumirea id">.
Exemplu:
<!DOCTYPE html>
<html>
<head>
<title>Utilizarea etichetei id</title> <style>
#titlulMeu
{
background-color: yellow;
color: maroon;
padding: 22px;
text-align: center;
}
</style>
</head>
<body>
<h1 id="titlulMeu">Titlul unei descrieri</h1>
</body>
</html>
Diferen?a dintre etichetele class ?i ID
Un element HTML poate avea doar un singur id care apar?ine acelui element, în timp ce o eticheta class poate fi utilizat de mai multe elemente:
Exemplu 2:
<!DOCTYPE html>
<html>
<head>
<title>Diferen?a dintre etichetele class ?i ID</title>
<style>
#titlulMeu
{
background-color: yellow;
color: maroon;
padding: 22px;
text-align: center;
}
.orase
{
background-color: navy;
color: yellow;
margin: 18px;
padding: 18px;
}
</style>
</head>
<body>
<h1 id="titlulMeu">Titlul unei descrieri</h1>
<div class="orase">
<h2>Bucuresti</h2>
<p>Bucuresti este capitala Romaniei</p>
</div><div class="orase">
<h2>Sinaia</h2>
<p>Sinaia este o statiune turistica din Romania</p>
</div><div class="orase">
</body>
<h2>Constanta</h2>
<p>Constanta este un oras din Romania cu port</p>
</div>
</html>
Utilizarea etichetei id în JavaScript
JavaScript poate accesa un element cu un id specificat folosind metoda getElementById ():
Exemplu 3:
<!DOCTYPE html>
<html>
<head>
<title>Utilizarea etichetei id în JavaScript</title>
<style>
#titlulMeu
{
background-color: yellow;
color: maroon;
padding: 22px;
text-align: center;
size: 26px;
}
</style>
</head>
<body>
<h2>Folosirea etichetei id in JavaScript</h2>
<p>JavaScript poate accesa un element cu
un id specificat folosind metoda getElementById ()</p>
<h1 id="titlulMeu">Hello World! </h1>
<button onclick="displayResult()">Schimba textul</button>
<script>
function displayResult() {
document.getElementById("titlulMeu").innerHTML = "Have a nice day!";
}
</script>
</body>
</html>
This tool makes it easy to create, adjust, and experiment with custom colors for the web.
Magnews2 is a modern and creative free magazine and news website template that will help you kick off your online project in style.
Find here examples of creative and unique website layouts.
Find here examples of creative and unique website CSS HTML menu.