2018/07/07

组合标签:
  <ul>
    <li>里面标签只能是li</li> 
  </ul>

列表
  1、有序列表
  2、无序列表


  <ol type="1"> <!-- 有序列表 用type更改样式 -->
    <li>列表1</li> <!-- 用 style="list-style-type: " " 使用无序列表表样式-->
    <li>列表1</li>
    <li>列表1</li>
  </ol>


  <ul type="square"> <!-- 无序列表 用type更改样式-->
    <li>列表1</li>
    <li>列表1</li>
    <li>列表1</li>
  </ul>

  练习
    <ul style="list-style-type: none">
      <li>
        山东
        <ul style="list-style-type: none">
          <li>
            淄博
            <ul style="list-style-type: none">
              <li>张店</li>
              <li>淄川</li>
              <li>临淄</li>
            </ul>
          </li>
          <li>
            济南
            <ul style="list-style-type: none">
              <li>历下</li>
              <li>市中</li>
            </ul>
          </li>
        </ul>
      </li>
    </ul>


  3、定义列表

    <dl>
      <dt>HTML</dt>
      <dd>超文本标记语言</dd>
      <dt>CSS</dt>
      <dd>层叠样式表</dd>
    </dl>



表格


  1、格式:<table>
        <tr>
          <td>1</td>
        </tr>
      </table>
  2、常用标签
    table表格 tr行 td单元格(th标题:特殊的单元格 ) 无实际意义(thead头 tbody 主体 )
    表格标题:<caption>
  3、常用属性
    table属性: width border cellspacing cellpadding align(居中)
    tr属性: height width align
    td属性: width align
  4、合并: 通过占位实现看起来合并的效果(单元格的属性)
    colspan:横向合并,向右合并
    rowspan:纵向合并,向下合并
  5、表格默认宽度高度:根据内容
  6、表格横平竖直的特性:更改一个单元格的宽高一行或者一列的表格都会改变

练习:
  <table width="100%" border="1" cellspacing="0" cellpadding="10" > <!--cellspacing=""单元格间距-->
    <caption>表格标题</caption> <!--cellpadding=""单元格内容与本单元格的边距-->
    <tr bgcolor="#FF0004" >
      <th>123456</th>
      <td colspan="2">1</td>
      <td rowspan="2">2</td>
      <td>3</td>
    </tr>
    <tr>
      <td width="100px">4</td>
      <td>5</td>
      <td>5</td>
      <td>5</td>
    </tr>
  </table>


猜你喜欢

转载自www.cnblogs.com/wjglm/p/9284462.html
07