• 今天学习了无序列表和有序列表和使用HTML5创建表格


    ol建立有序列表,该列表可以用设置type=”A/a”

    其语法架构为

    <ol>

    <li></li>

    <li></li>

    </ol>

    Ul建立无序列表, 该列表可以用设置type=” disc/circle/square”

    其语法架构为

    <ul>

    <li></li>

    <li></li>

    </ul>

    创建表格其基本属性有

    Cellspacing:定义边框与边框的间距大小

    Cellpadding:定义边框与内容的间隙大小

    Bgcolor:定义表格的背景颜色

    Width:定义表格的宽度

    Height:定义表哥的高度

    Caption:创建表格的标题

    Colspan:合并左右单元格

     Rowspan:合并上下单元格

    Th:定义标题内容

    Dd/dl:自定义列表

    Mark:重点提示

    附:

    <!doctype html>

    <html>

     <head>

      <meta charset="UTF-8">

      <title>20161018</title>

     </head>

     <body>

     <ul>

     <li>月落乌啼霜满天</li>

     <li>江枫渔火对愁眠</li>

      <li>姑苏城外寒山寺</li>

     <li>夜半钟声到客船</li>

     </ul>

     <ul type="disc">

    <li>月落乌啼霜满天</li>

     <li>江枫渔火对愁眠</li>

     </ul>

     <ul type="circle">

    <li>月落乌啼霜满天</li>

     <li>江枫渔火对愁眠</li>

     </ul>

     <ul type="square">

     <li>月落乌啼霜满天</li>

     <li>江枫渔火对愁眠</li>

     </ul>

      <ol type="A">

     <li>月落乌啼霜满天</li>

     <li>江枫渔火对愁眠</li>

      <li>姑苏城外寒山寺</li>

     <li>夜半钟声到客船</li>

     </ol>

      <ol>

     <li>月落乌啼霜满天</li>

     <li>江枫渔火对愁眠</li>

      <li>姑苏城外寒山寺</li>

     <li>夜半钟声到客船</li>

     </ol>

      <!-- 建立嵌套的ul/ol列表 -->

    <ol type="A">

     <li>月落乌啼霜满天</li>

     <li>江枫渔火对愁眠</li>

    <ul>

     <li>月落乌啼霜满天</li>

     <li>江枫渔火对愁眠</li>

     </ul>

    <ol type="a">

      <li>姑苏城外寒山寺</li>

     <li>夜半钟声到客船</li>

    </ol>

    </ol>

    <!-- 自定义列表 -->

    <dl>

    <dt>电脑</dt>

    <dd>是一种能够按照程序运行的电子设备</dd>

    <dt>显示器</dt>

    <dd>以视觉方式显示信息的装置</dd>

    </dl>

    <!-- 使用HTML5创建表格

    <table>...</table> - 定义表格

    <tr> - 定义表行

    <th> - 定义表头

    <td> - 定义表元

     其语法结构为

     <table>

     <tr>

     <td></td>

    <td></td>

    <td></td>

     </tr>

     </table>

     -->

     <!-- 创建一个三行三列的表格 -->

     <table border="2px"  cellpadding="2px" cellspacing="20px" bgcolor="DDSSAA">

     <caption>创建一个三行三列的表格</caption>

     <tr>

     <th>姓名</th>

      <th>学号</th>

      <th>成绩</th>

     </tr>

     <tr>

     <td align="left">1</td>

    <td align="center">1</td>

    <td align="rigth">1</td>

     </tr>

     <tr>

     <td>1</td>

    <td>1</td>

    <td>1</td>

     </tr>

      <tr>

     <td align="left">1</td>

    <td align="center">1</td>

    <td align="rigth">1</td>

     </tr>

     </table>

     <br/>

    <table border="2px"  cellpadding="2px" cellspacing="20px" bgcolor="pppppp">

     <caption>创建一个一行三列表格</caption>

     <tr>

     <td bgcolor="red">1</td>

    <td bgcolor="green">1</td>

    <td bgcolor="blue">1</td>

     </tr>

     </table>

    <!-- 单元格的合并 -->

    <br/><br/>

    <table width="40" height="40" border="1" cellpadding="20px" cellspacing="3px">

      <tr>

        <td colspan="2" align="center">1</td>

        <td rowspan="2" align="center">2</td>

      </tr>

      <tr>

        <td rowspan="2" align="center">3</td>

        <td align="center">5</td>

      </tr>

      <tr>

        <td colspan="2" align="center">4</td>

      </tr>

    </table>

    <br/><br/>

     </body>

    </html>

  • 相关阅读:
    Linux命令 tr
    Linux命令 xargs
    Python 文件读写 文件和路径
    Python 正则表达式 匹配任意字符
    Python 正则表达式 贪心匹配和非贪心匹配
    Python 正则表达式 匹配次数
    Python 正则表达式 利用括号分组
    Python 正则表达式 search vs match
    【转-整理】 SQL2008 提示评估期已过的解决方法
    Java http接口进阶——自我理解为接口框架形式
  • 原文地址:https://www.cnblogs.com/miffees/p/5975647.html
Copyright © 2020-2023  润新知