时间戳

首页 > 解决方案 > 使用条件更改列表的图标

html - 使用条件更改列表的图标

问题描述

我有以下工作要做：

在此处输入图像描述

这是我的以下 html 代码：

<!DOCTYPE html>
<head>
<meta charset="utf-8"/>
<link rel="stylesheet" href="style3.1.css">
<title> Menu </title>
</head>

<body>
<center> Menu </center>
    
<ul>

  <li>Thé
    <ul>
      <li>De Chine</li>
        <ul  id="a">
          <li>Cerise</li>
          <li>Raisin</li>
        </ul>
        
      <li>Vert</li>
    </ul>
  </li>
</ul>

<ul>

  <li>Café
    <ul>
      <li class ="iconized">Noir</li>
        <ul id="b">
          <li>Sucré</li>
          <li>Serré</li>
        </ul>
        
      <li class ="iconized">Au Lait</li>
    </ul>
  </li>
  
  
</ul>
</body>

</html>

这是我的css文件内容：

ul {list-style-type: circle;}
ul li ul{ list-style-type: disc;
}
#a { 
    list-style-type: lower-alpha;
}
#b { 
    list-style-type: decimal;
}

我只想通过图像更改范围 2 的字母顺序，在第二个列表中我想通过图标更改 li。我试过但徒劳无功。

标签： htmlcss

解决方案

推荐阅读