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

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.).

Sintax?:
<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">
<h2>Constanta</h2>
<p>Constanta este un oras din Romania cu port</p>
</div>

</body>
</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>
Tags: HTML id, exemple, diferenta dintre class si id

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