zoukankan      html  css  js  c++  java
  • html表格

    表格的主要用途是显示数据和图片,并且可以布局

     表格元素的名称是table

    <tr></tr>行

    <td><td>列  

    border表格边界  bordercolor边界颜色 width表格宽度    bgcolor表格背景色   align对齐方式 center居中

    cellspacing是空隙大小,是两个行、两个列直间的距离

    cellpadding是填充大小,各行各列中的内容被填充,这样会在一定程度上撑大格子

    ******************表格**********************<br>
    <!--tr表示一行,td表示一列-->
    <table border=5 cellspacing=5 bordercolor=yellow width=300px bgcolor=red>
    <tr align="center"><td>1</td><td>2</td><td>3</td></tr>
    <tr align="center"><td>4</td><td>5</td><td>6</td></tr>
    <tr align="center"><td>7</td><td>8</td><td>9</td></tr>
    </table><p></p>
    
    <table border=5 cellpadding=5 bordercolor=yellow width=300px bgcolor=red>
    <tr><td>1</td><td>2</td><td>3</td></tr>
    <tr><td>4</td><td>5</td><td>6</td></tr>
    <tr><td>7</td><td>8</td><td>9</td></tr></table>
    
    <table border align="center" width=500px>
    <tr><th>Food</th><th>Drink</th><th>Sweet</th>

    <tr><td>A</td><td>B</td><td>C</td> </table>

    <html>
    <head><title>菜谱</title></head>
    
    <body>
    <table border=5 bordercolor=yellow cellspacing=0  width=400px height=170 align=center border=5>
    <tr align=center><td colspan=3 >星期一菜谱</td></tr>
    
    <tr align=center><td rowspan=2>素材</td><td>青草茄子</td><td>花椒扁豆</td></tr>
    <tr align=center><td>小葱豆腐</td><td>炒白菜</td></tr>
    
    <tr align=center><td rowspan=2>荤菜</td><td>鱼香肉丝</td><td>红烧排骨</td></tr>
    <tr align=center><td>油焖大虾</td><td><img src="paigu.jpg" width=150/></td></tr>
    
    </table>
    
    </body>
    </html>

     

  • 相关阅读:
    Ⅰ.Spring的点点滴滴--序章
    Ⅶ.AngularJS的点点滴滴-- 事件
    Ⅵ.AngularJS的点点滴滴-- 指令
    vue路由跳转
    使用<a-select>时,placeholder不起作用
    动态配置生成echarts图表
    elementui resetFields()不起作用
    input输入框与button按钮之间存在空隙
    一个怂女婿的成长笔记【二十二】
    一个怂女婿的成长笔记【七】
  • 原文地址:https://www.cnblogs.com/Yimi/p/5848099.html
Copyright © 2011-2022 走看看