做(zuò)自(zì)由與創造的先行(xíng)者

HTML 類

HTML中文手冊

對 HTML 進行(xíng)分類(設置類),使我們能(néng)夠為(wèi)元素的類定義 CSS 樣式。

為(wèi)相同的類設置相同的樣式,或者為(wèi)不同的類設置不同的樣式。

London

London is the capital city of England. It is the most populous city in the United Kingdom, with a metropolitan area of over 13 million inhabitants.

Standing on the River Thames, London has been a major settlement for two millennia, its history going back to its founding by the Romans, who named it Londinium.

實例

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

It is the most populous city in the United Kingdom,

with a metropolitan area of over 13 million inhabitants.

</p>

</div>

</body>

</html>

分類塊級元素

HTML <div> 元素是塊級元素。它能(néng)夠用作(zuò)其他(tā) HTML 元素的容器。

設置 <div> 元素的類,使我們能(néng)夠為(wèi)相同的 <div> 元素設置相同的類:

London

London is the capital city of England. It is the most populous city in the United Kingdom, with a metropolitan area of over 13 million inhabitants.

Standing on the River Thames, London has been a major settlement for two millennia, its history going back to its founding by the Romans, who named it Londinium.

Paris

Paris is the capital and most populous city of France.

Situated on the Seine River, it is at the heart of the �le-de-France region, also known as the r�gion parisienne.

Within its metropolitan area is one of the largest population centers in Europe, with over 12 million inhabitants.

Tokyo

Tokyo is the capital of Japan, the center of the Greater Tokyo Area, and the most populous metropolitan area in the world.

It is the seat of the Japanese government and the Imperial Palace, and the home of the Japanese Imperial Family.

The Tokyo prefecture is part of the world's most populous metropolitan area with 38 million people and the world's largest urban economy.

實例

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

It is the most populous city in the United Kingdom,

with a metropolitan area of over 13 million inhabitants.</p>

</div>

<div class="cities">

<h2>Paris</h2>

<p>Paris is the capital and most populous city of France.</p>

</div>

<div class="cities">

<h2>Tokyo</h2>

<p>Tokyo is the capital of Japan, the center of the Greater Tokyo Area,

and the most populous metropolitan area in the world.</p>

</div>

</body>

</html>

分類行(xíng)內(nèi)元素

HTML <span> 元素是行(xíng)內(nèi)元素,能(néng)夠用作(zuò)文本的容器。

設置 <span> 元素的類,能(néng)夠為(wèi)相同的 <span> 元素設置相同的樣式。

實例

<!DOCTYPE html>

<html>

<head>

<style>

span.red {color:red;}

</style>

</head>

<body>

<h1>My <span class="red">Important</span> Heading</h1>

</body>

</html>

網站建設開(kāi)發|APP設計開(kāi)發|小程序建設開(kāi)發
下(xià)一(yī)篇:HTML id 屬性
上(shàng)一(yī)篇:HTML <div> 和(hé) <span>