<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head> <body topmargin="200" leftmargin="200"><a name="top"></a>
今天天气不错<br />
<font color="red" size="35">
<b>文字加粗方式1,b标签</b><br />
<strong>文字加粗方式2,strong标签</strong><br />
<i>文字倾斜方式1,i标签</i><br />
<em>文字倾斜方式2,em标签</em><br />
<u>文字加下划线,u标签</u><center>center居中标签,默认前后若有其他,执行前后换行,保证自身是一个整体,然后进行居中显示</center>123
<p>p标签,段落标签,默认前后若有其他,执行前后换行并且空开一行</p>
123<ol>ol有序列表
<li>默认自带序号</li>
<li>自动换行</li>
<li>默认前后若有其他,执行前后换行并且空开一行</li>
</ol>123
<ul>ul无序列表
<li>默认不自带序号</li>
<li>自动换行</li>
<li>默认前后若有其他,执行前后换行并且空开一行</li>
</ul>456<br />
<a href="http://www.baidu.com/" target="_blank">百度一下</a><br />
<img src="n0.jpg" title="这是一头牛" alt="zheshiyitouniu" /><br />
<a href="http://360.com"><img src="n0.jpg" width="325" /></a><br />
<img src="n0.jpg" width="400" height="150" />
</font>
<h1>h1~h6标签,标题控制标签</h1>
<h2>重要性依次减小</h2>
<h3>默认前后若有其他,执行前后换行并且空开一行</h3>
<h4>在大环境内的字体大小的基础之上进行加或者减</h4>
<div style="background-color:#0F6">div层标签,默认一上来就占用一行</div>
<span style="background-color:#936">span层标签,使用多少就占用多少</span><br /><br /> <table align="center" width="480" height="90" border="1" cellpadding="0" cellspacing="0">
<tr align="center">
<td width="120"><a href="http://autohome.com/">汽车之家</a></td>
<td width="120">易车网</td>
<td width="120">太平洋汽车</td>
<td rowspan="2">新浪汽车</td>
</tr>
<tr align="center">
<td>58同城</td>
<td>赶集网</td>
<td>百姓网</td>
</tr>
<tr align="center">
<td colspan="2">淘宝</td>
<td>唯品会</td>
<td>聚美优品</td>
</tr>
</table> <br /> <a href="#top">返回最顶端</a>
</body>
</html>

font

文字加粗方式1,b标签
文字加粗方式2,strong标签
文字倾斜方式1,i标签
文字倾斜方式2,em标签
文字加下划线,u标签

center居中标签,默认前后若有其他,执行前后换行,保证自身是一个整体,然后进行居中显示

p标签,段落标签,默认前后若有其他,执行前后换行并且空开一行

span层标签,使用多少就占用多少

标题

h1~h6标签,标题控制标签

重要性依次减小

默认前后若有其他,执行前后换行并且空开一行

在大环境内的字体大小的基础之上进行加或者减

 超链接标签

一,锚点标签 <a name=“”?/></a>

 二,锚点链接 <a href=“目标链接的name值"></a>

图片标签

<img src="图片地址"  title =”文字“ alt="文字" width="" heigh=""/>

title 用来为元素提供额外说明信息

alt 为了给那些不能看到你文档中图像的浏览者提供文字说明

 

表格,

对齐方式align;宽width ;高height;边宽border;边距cellpadding ;间距cellspacing;

行 

水平对齐方式align  ;竖直对齐方式 valign  ;行高height

单元格

<th></th>表头,内容自动居中加粗

水平对齐方式align  ;竖直对齐方式 valign  ;行高height

colspan 合并水平单元格;rowspan合并竖直单元格

 表格标题

<caption></caption>  

caption 元素定义表格标题。

caption 标签必须紧随 table 标签之后。您只能对每个表格定义一个标题。通常这个标题会被居中于表格之上

单实线表格双实线表格

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head> <body > <font size="+5"> <caption>粗线表格 </caption>
<table  border="1" width="500" cellpadding="0"  cellspacing="1"  bgcolor="#000000">
<tr bgcolor="#FFFFFF">
<td>qqqq</td> </tr>
</table>
</table> <caption> 单实线表格</caption> <table border="0" width="500" cellpadding="0" cellspacing="1" bgcolor="#000000"> <tr bgcolor="#FFFFFF"> <td>qqqq</td> </tr> </table> </font> </body> </html>

横单线

<table width="60%" border="1" cellspacing="0" cellpadding="0" rules="rows" frame="hsides">
<caption>这是系列横单线试验</caption>
<tr>
<td> 这是系列横单线试验,效果还好吧?</td>
</tr>
<tr>
<td> </td>
</tr>
<tr>
<td> </td>
</tr>
</table>

、<table>标记的rules和frame参数,rules参数是对表格的内部边框作显示控制。

  rules="none":表示不加内部边框;

  rules="rows":表示只显示水平方向的边框;

  rules="cols:表示只显示垂直方向上的边框;

  rules="all":则是显示所有方向上的边框,这也是默认值;

  frame="void":表示不加外边框;

  frame="above":表示显示上边的外边框;

  frame="below":表示显示下边的外边框;

  frame="lhs" :表示显示左边的外边框;

  frame="rls" :表示显示右边的外边框;

  frame="hsides":表示显示上下外边框;

  frame="vsides":表示显示左右外边框;

  frame="box" 则表示显示所有外边框。

HTML基础和表格的更多相关文章

  1. Bootstrap <基础五>表格

    Bootstrap 提供了一个清晰的创建表格的布局.下表列出了 Bootstrap 支持的一些表格元素: 标签 描述 <table> 为表格添加基础样式. <thead> 表格 ...

  2. 【HTML基础】表格和表单

    本次博客的主要内容如下: meta和link 表格 表单 meta和link meta meta的属性有两种:name和http-equiv. name属性主要用于描述网页内容,对应与网页内容. 1. ...

  3. HTML基础用 表格做报表

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  4. h5标签基础 table表格标签

    一.表格的定义:用于有规范的显示数据. 二.基本组成: 行<tr>/列<td>/表头<caption>/表标题<th> eg: <table> ...

  5. Bootstrap3基础 table-striped 表格实现隔行换色(浅灰色与白色交替)

      内容 参数   OS   Windows 10 x64   browser   Firefox 65.0.2   framework     Bootstrap 3.3.7   editor    ...

  6. Bootstrap3基础 table-condensed 表格中的单元格紧凑一些

      内容 参数   OS   Windows 10 x64   browser   Firefox 65.0.2   framework     Bootstrap 3.3.7   editor    ...

  7. 3.html基础标签:表格

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  8. [19/06/08-星期六] CSS基础_表格&表单

    一.表格 如生活中的Excel表格,用途就是同来表示一些格式化的数据,如课程表.工资条.成绩单. 在网页中也可以创建出不同的表格,在HTML中使用table标签来创建一个表格.table是个块元素. ...

  9. html基础与表格的理解·

    1.静态网页与动态网页的区别:是否访问数据库 2.超文本:超文本是指超出文本的范围,可以插入声音视频,表格图片等 3.标记语言与网页结构:标记语言就是标签,网页结构包含<html>< ...

随机推荐

  1. apache配置VirtualHost(windows)

    以下方式适合原生 Apache, XAMPP 和WAMP 套件. 1. 打开目录 {Apache2 安装目录}\conf\extra\, 找到 httpd-vhosts.conf 文件. 2. 仿照例 ...

  2. 【转载】MySQL查询阻塞语句

    select r.trx_id waiting_trx_id, r.trx_mysql_thread_Id waiting_thread,        r.trx_query waiting_que ...

  3. Java中的main()方法详解

    在Java中,main()方法是Java应用程序的入口方法,也就是说,程序在运行的时候,第一个执行的方法就是main()方法,这个方法和其他的方法有很大的不同,比如方法的名字必须是main,方法必须是 ...

  4. matlab实现高斯消去法、LU分解

    朴素高斯消去法: function x = GauElim(n, A, b) if nargin < 2 for i = 1 : 1 : n for j = 1 : 1 : n A(i, j) ...

  5. Java加解密与数字签名

    ** Java加解密 ** 实现方式:JDK实现,CC,BC JDK提供比较基础的底层的实现:CC提供一些简化的操作:BC提供补充 一.Base64加密 非常简单,加密解密就一个函数. 代码如下: 二 ...

  6. get的四种请求形式

    $_GET变量当用户以get方式请求页面并发送数据的时候,$_GET变量就存储了这些数据——get数据!get请求有4种形式:形式1:<form  action=”abc.php”   meth ...

  7. SQL Server数据库事务日志存储序列

    原文 原文:http://blog.csdn.net/tjvictor/article/details/5251351   如果你的数据库运行在完整或是批量日志恢复模式下,那么你就需要使用作业(job ...

  8. Http之Get/Post请求区别

    Http之Get/Post请求区别 1.HTTP请求格式: <request line> <headers> <blank line> [<request-b ...

  9. clion 帮助文档 EN

    下载时间 2015年10月 下载地址:http://pan.baidu.com/s/1E4fgE 备用地址:链接:http://pan.baidu.com/s/1bn6u5Wj 密码:icn4

  10. Document Set 【一】

    概括介绍: Document Set 是SharePoint2010之后出现的一个新的Feature.这个Feature的主要目的是两个: 1,是帮助 User 以一个文件的管理方式管理一个文件集合. ...