Html class属性| 21xrx.com

给块级元素添加class属性

class属性等价于给<div>元素添加style属性

上海

上海,简称“沪”或“申”,是中国共产党的诞生地,中华人民共和国直辖市,国家中心城市,超大城市,沪杭甬大湾区核心城市,国际经济、金融、贸易、航运、科技创新中心 [1-2] ,首批沿海开放城市.上海地处长江入海口,是长江经济带的龙头城市、G60科创走廊核心城市.隔东中国海与日本九州岛相望,南濒杭州湾,北、西与江苏、浙江两省相接.

成都

成都,简称蓉,别称蓉城、锦城,是四川省省会,西南地区唯一一个副省级市,特大城市,国家重要的高新技术产业基地、商贸物流中心和综合交通枢纽,西部地区重要的中心城市. [1-3] 2017年,全市下辖20个区（市）县和成都高新区、天府新区成都直管区, [4] 面积1.46万平方公里,常住人口1600余万人,GDP超1.3万亿元, [5] 城镇化率达70.6%.

达州

达州是四川省下辖的地级市,位于四川省东部,自东汉建县至今已有1900多年的历史,历为该地区州、郡、府、县所在地.达州幅员面积16591平方公里,辖2个市辖区（通川区、达川区）、4个县（宣汉县、开江县、大竹县、渠县）、代管1个县级市（万源市）,另附加一个经济开发区,共685.23万人.

例子

<head>
<style>
div.cities {
    background-color:orange;
    color:white;
    margin:20px;
    padding:20px;
} 
</style>
</head>
<body>

<div class="cities">
                <h5>上海</h5>
                <article>上海,简称“沪”或“申”,是中国共产党的诞生地,
中华人民共和国直辖市,国家中心城市,
{{}}{{}}超大城市,沪杭甬大湾区核心城市,
国际经济、金融、贸易、航运、科技创新中心 [1-2]  ,首批沿海开放城市.
上海地处长江入海口,是长江经济带的龙头城市、G60科创走廊核心城市.
隔东中国海与日本九州岛相望,南濒杭州湾,北、西与江苏、浙江两省相接.</article>
            </div>
            <div class="cities">
                <h5>成都</h5>
                <article>成都,简称蓉,别称蓉城、锦城,是四川省省会,
西南地区唯一一个副省级市,特大城市,
国家重要的高新技术{{}}产业基地、商贸物流中心和综合交通枢纽,
西部地区重要的中心城市. [1-3]  2017年,
全市下辖20个区（市）县和成都高新区、天府新区成都直管区, 
[4]  面积1.46万平方公里,常住人口1600余万人,
GDP超1.3万亿元, [5]  城镇化率达70.6%.</article>
            </div>
            <div class="cities">
                <h5>达州</h5>
                <article>达州是四川省下辖的地级市,
位于四川省东部,自东汉建县至今已有1900多年的历史,
历为该地区州、郡、府、县所在地.
达州幅员面积16591平方公里,辖2个市辖区（通川区、达川区）、
4个县（宣汉县、开江县、大竹县、渠县）、代管1个县级市（万源市）,
另附加一个经济开发区,共685.23万人.</article>
            </div>

</body>
</html>

内联元素添加class属性

给<span>元素添加class属性等价于style属性.

例子

<!DOCTYPE html>
<html>
<head>
<style>
span.note {font-size:120%;color:red;}
</style>
</head>
<body>

<h1>编程是我的 <span class="note">爱好</span> </h1>
<p> <span class="note">无聊</span> 就敲敲代码.</p>

</body>
</html>

HTML class属性

给块级元素添加class属性

上海

成都

达州

例子

内联元素添加class属性

例子

评论区