HTML新浪新闻标题样式-部分标题颜色大小改变 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>焦点访谈：中国底气 新思想夯实大国粮仓</title>
</head>
<body>
   <img src="./Picture/xinlanglogo.png" > 新浪政务>正文
    <h1>焦点访谈：中国底气 新思想夯实大国粮仓</h1>
    <style>
    h1{
      color:rgb(82,82,82);
    }
    #time{
        color:rgb(181,181,181);
        font-size:20px; /* 设置字体大小 */
    }
    </style>
    <hr>
   <!--  我们需要把时间修改成灰色，但是时间没有被任何html标签包裹，所以要使用一个没有任何语义的标签进行包裹，
    用   <span>2023年03月02日</span> <span> 21：50 央视网</span> 
    但是这样写央视网也会变成灰色，所以需要进行选择
    一、CSS选择器：用来选取需要设置样式的元素（标签）
    1、元素选择器，例如：
     <span >2023年03月02日21：50 </span> <span> 央视网</span>
     <style>
    span{
        color:rgb(181,181,181);
    }
     </style>   
    注意：span一定要放在<style></style>中才可以!!!
    2、id选择器
    <span class="cls" id="time">2023年03月02日21：50 </span> <span> 央视网</span>
    <style>
    #time{
        color:rgb(181,181,181)
    }
    </style>
      注意：#time一定要放在<style></style>中才可以!!!
   
    3、类选择器，直接在标签中指定属性
    <span class="cls">2023年03月02日21：50 </span> <span> 央视网</span>
    <style>
   .cls{
        color:rgb(181,181,181)
    }
    </style>
      注意：.cls一定要放在<style></style>中才可以!!!
    二、如果三种选择器同时存在，那么id选择器优先级最高，其次是类选择器，元素选择器的优先级最低
    三、如果要设置字体的大小，用font-size:12px来做
    --> 
    <span class="cls" id="time">2023年03月02日21：50 </span> <span> 央视网</span>
   
    <hr>
</body>
</html>
posted @ 2025-05-08 22:30  琬六岁  阅读(22)  评论(0)    收藏  举报