Html 如何在左侧显示头部

我试图在频道列表的每一行左边显示字母表。我该怎么做呢

<div class="w3-container w3-threequarter">
    <ul class="w3-ul w3-card-1" *ngFor="let head of channelDisplayHeads" >
     <h1 align="center" style="background-color:#0083BC"><font color="white">{{ head }}</font></h1>
      <ng-container *ngFor="let channel of channelList">
        <li class="list-group-item logoDisplay" *ngIf="channel.channel.substr(0, 1) === head">
            <img class="w3-image" src= "{{ channel.logo }}" align="center" alt="{{ channel.channel }}" width="80" height="80"><br>
            <!-- <span align="center"><strong><font size="2">{{ channel.channel }}</font></strong></span><br> -->
          <span class="w3-left"><mark><font size="1">{{ channel.cbsCode }}</font></mark></span><span class="w3-sand w3-right" style="text-shadow:0.2px 0.2px 0 #444"><font size="2">{{ channel.pickCode }}</font></span>
        </li>
      </ng-container>
    </ul>
  </div>

{{head}}



{{channel.cbsCode}{{channel.pickCode}}

到目前为止，我是如何做到这一点的。我需要每行左边的“A”、“B”、“C”。请告知！

---

在每个标题行上，您只需执行以下操作

text-align: left

在css中，标题行应该是这样的

<h1 style="background-color:#0083BC; text-align:left;"><font color="white">{{ head }}</font></h1>

---

在每个标题行上，您只需要执行

text-align: left

在css中，标题行应该是这样的

<h1 style="background-color:#0083BC; text-align:left;"><font color="white">{{ head }}</font></h1>

这一行：

<h1 align="center" style="background-color:#0083BC"><font color="white">{{ head }}</font></h1>

{{head}

应该是：

<h1 style="background-color:#0083BC; text-align: left;"><font color="white">{{ head }}</font></h1>

{{head}

i、 e.添加

文本对齐：左删除
对齐：居中
此行：

<h1 align="center" style="background-color:#0083BC"><font color="white">{{ head }}</font></h1>

{{head}

应该是：

<h1 style="background-color:#0083BC; text-align: left;"><font color="white">{{ head }}</font></h1>

{{head}

i、 e.添加
文本对齐：左删除
对齐：居中
这是您的解决方案：

.w3-ul > h1{
width: 40px;
float: left;
}
.logoDisplay{
float: left;
}

或者

这是您的解决方案：

.w3-ul > h1{
width: 40px;
float: left;
}
.logoDisplay{
float: left;
}

或者

从
中删除
align=“center”
，并添加
文本对齐：left

试试这个

<h1 style="background-color:#0083BC; text-align: left"><font color="white">{{ head }}</font></h1>

{{head}
从
中删除
align=“center”
，然后添加
文本对齐：左

试试这个

<h1 style="background-color:#0083BC; text-align: left"><font color="white">{{ head }}</font></h1>

{{head}
你好，雨果·诺罗。只是没有完全正确。你能用一些代码示例解释一下吗？大家好，谢谢你们的快速响应，但这不是我想要的方式。我试着把它放在同一排频道的左边一次哦，好吧，这有点不同。不太清楚。我会在这种情况下编辑我的答案。只是没有完全正确。你能用一些代码示例解释一下吗？大家好，谢谢你们的快速响应，但这不是我想要的方式。我试着把它放在同一排频道的左边一次哦，好吧，这有点不同。不太清楚。我将编辑我的答案，在这种情况下，这正是我所寻找的。谢谢这正是我想要的。谢谢