HTML Sınıfları

Categorize HTML (set class) so that we can define CSS styles for the class of the element.

Set the same style for the same class, or set different styles for different classes.

Örnek

<!DOCTYPE html>
<html>
<head>
<style>
.cities {
    background-color:black;
    color:white;
    margin:20px;
    padding:20px;
} 
</style>
</head>
<body>
<div class="cities">
<h2>London</h2>
<p>
London is the capital city of England. 
Bu, Birleşik Krallık'taki nüfusu en yoğun şehridir, 
with a metropolitan area of over 13 million inhabitants.
</p>
</div> 
</body>
</html>

Kişisel Deneyim

Categorized block-level elements

The HTML <div> element isBlock-level elementsIt can be used as a container for other HTML elements.

Set the class of the <div> element so that we can set the same class for the same <div> element:

Örnek

<!DOCTYPE html>
<html>
<head>
<style>
.cities {
    background-color:black;
    color:white;
    margin:20px;
    padding:20px;
} 
</style>
</head>
<body>
<div class="cities">
<h2>London</h2>
<p>London is the capital city of England. 
Bu, Birleşik Krallık'taki nüfusu en yoğun şehridir, 
13 milyondan fazla nüfusu olan bir metropol alanına sahiptir.</p>
</div>
<div class="cities">
<h2>Paris</h2>
<p>Paris, Fransa'nın başkenti ve nüfusu en yoğun şehridir.</p>
</div>
<div class="cities">
<h2>Tokyo</h2>
<p>Tokyo, Japonya'nın başkenti, Büyük Tokyo Bölgesi'nin merkezi,</p>
ve dünyanın nüfusu en yoğun metropol alanıdır.</p>
</div>
</body>
</html>

Kişisel Deneyim

Sınırlı Satırlı Elementler Kategorisi

HTML <span> elementi satırlı elementtir ve metin konteyneri olarak kullanılabilir.

Bir <span> elementinin sınıfını ayarlamak, aynı <span> elementlerine aynı stilleri uygulamanıza olanak tanır.

Örnek

<!DOCTYPE html>
<html>
<head>
<style>
  span.red {color:red;}
</style>
</head>
<body>
<h1>My <span class="red">Important</span> Heading</h1>
</body>
</html>

Kişisel Deneyim