• 第1部分 HTML 表格


    <html>——开始标签

      <head>

      网页上的控制信息

    <title>页面标题</title>

      </head>

      <body>

      页面显示的内容

      </body>

    </html>——结束标签

    <!——注释内容——>注释

    body的属性:

    bgcolor      页面背景色

    text        文字颜色  

    tomargin       上页边距

    leftmargin     左页边距

    rightmargin     右页边距

    bottomargin    下页边距

    background    背景壁纸

    一般标签

    格式控制标签

    <font color="" face="" size=""></font>     控制字体; color="##FF0000";    face,字体;size,字体大小。

    <b></b>           字体加粗

    <i></i>            倾斜

    <u></u>            下划线

    <strong></strong>      字体加粗(强调,语气加强用)

    <em></em>          字体倾斜(强调,语气加强用)

    <center></center>      居中

    <br>或<br/>          相当于回车

    &nbsp;              表示空格  也可以在设计页面中按ctrl+shift+space

    内容容器标签

    <h1></h1>……<h6></h6>  标题(会自动换行)。HTML标题(Headling)是通过<h1>—<h6>等标签进行定义的。

    <p></p>          段落标签(段落之间空行)

    <div></div>         层标签(默认占一行)

    <span></span>      层标签(默认用多大空间占多大空间)

    <ol type="1">——有序列表,序号为1,2,3……,引号中可以更改序号形式

    <li>内容</li>

    <li>内容</li>

    </ol>——上面“ol”改为“ul”则为无序列表

    “../”表示上机目录

    “./”表示当前目录

    相对路径:从当前页面开始查找。

    绝对路径:从网站的根开始查找。“/”,代表网站的根。

    HTML元素指的是从开始标签(start tag)到结束标签(end tag)的所有代码。

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>淄博汉企</title>
    </head>
    
    <body bgcolor="#66FF99" topmargin="200" leftmargin="200px" bottommargin="400">
    <a name="top"></a>
    今天<br>天气&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;不错。<br />
    <font size="45" color="#FF0000">
    格式控制标签:<br />
    <b>文字加粗方式1,b标签</b><br />
    <strong>文字加粗方式2,strong标签</strong><br />
    <i>文字倾斜方式1,i标签</i><br />
    <em>文字倾斜方式2,em标签</em><br />
    <u>字体加下划线,u标签</u>
    123<center>center居中标签。默认前后若有其他,执行上下换行,保证自身是一个整体</center>
    <br />
    内容容器标签:<br />
    123<p>p标签,段落标签。默认前后若有其他,执行上下换行并且空开一行,表示内部是一个整体。</p>
    <ol>有序列表,ol标签
    <li>默认自带序号</li>
    <li>默认自动换行</li>
    <li>默认上下有空行</li>
    </ol>
    <ul>无序列表,ul标签
    <li>默认自带序号</li>
    <li>默认自动换行</li>
    <li>默认上下有空行</li>
    </ul>
    <a href="http://www.baidu.com/" target="_blank">百度一下</a>
    <img src="11.jpg" title="这是夕阳" alt="这应该是夕阳" /><br />
    <a href="http://360.com/"><img src="11.jpg" width="600" /><br /></a>
    <img src="11.jpg" width="400" height="200"/>
    
    </font>
    <h1>h1到h6标签,标题格式控制标签<h1>
    <h2>默认换行<h2>
    <h3>重要性依次递减<h3>
    <h4>上下默认空行<h4>
    <div style="background-color:#CF0">div层标签。默认是占用一行</div>
    <span style="background-color:#60C">span层标签。默认使用多少就占多少</span><br />
    
    <table width="400" height="90" border="0" cellpadding="0" cellspacing="0">
    <tr align="center">
    <td width="100">58同城</td>
    <td width="100">赶集网</td>
    <td width="100">百姓网</td>
    <td width="100" rowspan="2" bgcolor="#FF6600">安居客</td>
    </tr>
    <tr align="center">
    <td>太平洋汽车</td>
    <td><a href="http://www.baidu.com/">汽车之家</a></td>
    <td>易车网</td>
    
    </tr>
    <tr align="center">
    <td colspan="2" bgcolor="#660033">天猫</td>
    
    <td>京东</td>
    <td>唯品会</td>
    </tr>
    </table>
    
    
    
    <a href="#top">返回最顶端</a>
    </body>
    </html>
    View Code

    常用标签

    超链接标签

    <a href="超链接地址" target="_blank">超链接的文字</a>    ——href(hyperlink reference);_blank是在新窗口打开。

    第一步:做锚点的标签。<a name=""></a>

    第二步:做锚点链接。<a href="目标链接的name 的值"></a>

    图片标签

    <img src="图片地址"alt="文字" width=""height=""/>——高跟宽设置一个即可,显示图片会按比例缩放。alt在图片无法加载时,显示文字,还可帮主搜索引擎搜索。

    表格与表单

    表格

    <table></table>表格

    宽度。可以用像素或百分比表示。常用960像素。          

    border:边框。常用值0.

    cellpadding:内容跟单元格边框的边距。常用值0.

    cellspacing:单元格之间的间距。常用值0.

    align:对齐方式。

    bgcolor:背景色。

    background:背景图片。

    <tr></tr>行

    align:一行的内容的水平对齐方式

    valign:一行的内容的垂直对齐方式

    height:行高

    bgcolor:背景色

    background:背景图片

    <td></td>单元格

    <th></th>表头,单元格的内容自动居中、加粗

    align:单元格的内容的对齐方式

    valign:单元格的内容的垂直对齐方式

    单元格宽度

    height:单元格高度

    bgcolor:背景色

    background:背景图片

    内容必须放在单元格里,单元格必须放在行里,行必须放在表格里。设置单元格行高、列高时,会同时影响对应的行或列。

    单元格合并:(建议尽量使用表格嵌套)

    colspan="n"   合并同一行单元格(后面写代码要减去相对应的列)

    rowspan="n"   合并同一列单元格(从第二行开始减去对应的列)

  • 相关阅读:
    第二章 信息的表示和处理(下)
    第二章 信息的表示和处理
    IDEA中新建子模块
    手动实现一个可重入锁
    Lock接口的认识和使用
    JDK提供的原子类原理与使用
    深入理解volatile原理与使用
    模拟死锁
    模拟自旋锁
    grep 如何自动标注颜色
  • 原文地址:https://www.cnblogs.com/cycanfly/p/5296972.html
Copyright © 2020-2023  润新知