html列有序列表

时间:2017-06-02 13:59:05

标签: html list

如何在多个列中显示无序列表?我有一个HTML无序列表(子弹)。我也有多列。我想打印HTML文档。唯一接近工作的浏览器是FireFox。 Goggle Chrome(v58)显示所有列,但仅显示第一列中的项目符号。 IE(V11)完全忽略了COLUMNS样式。

FireFox似乎忽略了边缘。

以下是我的HTML代码段:

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>Home Movies</title>
    <style type="text/css" media="print">
        @page
        {
        margin: 2cm
        }
    </style>
    <style>
      body {height: 11}
      h1 {text-align:center}
      h3 {text-align:center}
      h4 {text-align:center}
      .slot {color: RED}
      .time {color: GREEN}
      .case {color: TURQUOISE}
      .disc {color: ORANGE}
      .hm   {color: DARKTEAL}
      .break { page-break-before: always; }
      .list {-webkit-columns: 50px 4;
             -moz-columns: 50px 4;
             columns: 50px 4
             float: left;
             position: relative;
             margin-right: 20px;
             font-family: Arial;
             font-size:x-small;
    </style>
  </head>
  <body>
    <header>
      <h1>Home Movies by Title</h1>
      <h3>1/Jun/2017</h3>
      <h4><span class="slot">[DVD Slot]</span> <span class="time">[Time]
        </span> <span class="case">{In Case}</span> <span class="disc">{On 
        Disc}
        </span> <span class="hm">(Hallmark Rating)</span></h4>
    </header>
<ul class="list">

0 个答案:

没有答案