基础结构

基础标签有HTML，head，body。

合格的的HTML页面：

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4.     <meta charset="UTF-8">
  5.     <meta name="keywords" content="关键字1，关键字2，…" />
  6.     <meta name="description" content="内容介绍" />
  7.     <title>这里是标题</title>
  8. </head>
  9. <body>
  10.     这里是内容
  11. </body>
  12. </html>

HTML常用标签

1、换行符<br />

  1. <br />

2、段落

  1. <p align=“center”>这是一个段落</p>

属性align

行对齐方式(left, right, center)

3、标题

  1. <h1>标题1</h1>
  2. <h2>标题2</h2>
  3. <h3>标题3</h3>
  4. <h4>标题4</h4>
  5. <h5>标题5</h5>
  6. <h6>标题6</h6>

4.文本格式化

  1. <b>定义粗体文本</b>
  2. <i> 定义斜体文本 </i>
  3. <del>定义删除文本</del>
  4. <sup>定义上标字</sup>
  5. <sub>定义下标字</sub>

5、链接

  1. <a href=“URL”> ~ </a>

属性：

href 定义链接地址

title 链接提示信息

target 链接打开方式(_blank 新的空白页,_self 当前页,_top)

常规使用：

  1. <a href=“about.html”>内部链接 </a>

其他应用：

  1. <a href=“mailto:邮箱地址”>邮件链接</a>
  2. <a href=“tel:电话号码”>一键拨打</a>
  3. <a href="sms:139xxxxxxx">一键发送短信</a>

6、锚点

锚点标签用于使用户"跳"到文档的某个部分。

  1. <a href="#位置名"> ~ </a>
  2. <a name="位置名"> ~ </a>

7、图像

  1. <img src="URL" width="100" height="100" alt="替代文字" />

属性：

src 定义图像的url

alt 定义图像的替代文本

width 设置图像的宽度

height 设置图像的高度

  1. ./            当前目录
  2. ../            回到上一层目录
  3. images/            进入一层目录
  4. ../images/            回到上一层目录，然后再进入images目录

9、图像热区

  1. <img src="URL"  usemap="# map 名称" />
  2. <map name="map 名称">
  3.     <area shape="形状" coords="坐标值" href="URL" />
  4. </map>

属性：

shape 热区形状(rect、circle、poly )

coords 形状的坐标值

10、HTML 实体字符

  1. 大于号 (>)     &gt;
  2. 小于号 (<)     &lt;
  3. 引号 (")       &quot;
  4. 注册商标(®)    &reg;
  5. 版权(© )       &copy;
  6. & 号           &amp;

11、无序列表

  1.   <ul>
  2.     <li>……</li>
  3.     <li>……</li>
  4.     <li>……</li>
  5. </ul>

属性    Type

属性值  disc（实心圆）  Circle（空心园）   square（方形）

12、有序列表

  1. <ol >
  2. <li>……</li>
  3. <li>……</li>
  4. <li>……</li>
  5. </ol>

属性    Type

属性值  1、 a 、 A、i、I

属性   start   排序的起点数值

13、

定义列表

  1. <dl>
  2. 　　<dt>HTML</dt>
  3. 　　<dd>html 是超文本标记语言</dd>
  4.  
  5. 　　<dt>XHTML</dt>
  6. 　　<dd>可扩展超文本置标语言 </dd>
  7. 　　<dd>表现方式与超文本置标语言（HTML）类似，不过语法上更加严格 </dd>
  8. </dl>

14、HTML 表格

  1. <table border="1">
  2. 　　<tr>
  3. 　　　　<td>row 1, cell 1</td>
  4. 　　　　<td>row 1, cell 2</td>
  5. 　　</tr>
  6. 　　<tr>
  7. 　　　　<td>row 2, cell 1</td>
  8. 　　　　<td>row 2, cell 2</td>
  9. 　　</tr>
  10. </table>

<table> 定义表格 <th> 定义表头 <tr> 定义表格的行 <td> 定义表格单元

具体属性：表格链接

15、<iframe> 内嵌框架

它可以把一个网页显示在另一个网页中。

  1. <iframe src="url" frameborder="0" width="100" height="100" scrolling="yes"></iframe>
  2.  
  3.  scrolling可选项：yes，no，auto。设置是否显示滚动条。

16、form表单

  1. <form action="url" method="post" enctype="multipart/form-data" target="_blank"></form>

属性            说明
name           表单的名称
action          表单提交地址
method       表单数据提交的方式 （get ,post）
enctype       MIME类型
target          打开方式

17、input表单元素与form表单里的其他元素

链接在此

随机推荐

  1. HDU 2689Sort it 树状数组 逆序对

    Sort it Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others)Total Sub ...

  2. iOS（OC）中的冒泡排序

    NSMutableArray *array = [NSMutableArray arrayWithObjects:@"12",@"84", @"35& ...

  3. Navicat for Oracle 连接oracle 配置

    oci.dll  替换为对应oracle版本的oci.dll

  4. 尽量少用if else

    Michael Feathers是Object Mentor International公司的技术顾问.他的工作不仅是技术开发,他还参与对世界各地技术团队进行培训.指导等工作.他曾开发了将JUnit迁 ...

  5. (Unity)Unity自定义Debug日志文件，利用VS生成Dll文件并使用Dotfuscated进展混淆，避免被反编译

    Unity自定义Debug日志文件,利用VS生成Dll文件并使用Dotfuscated进行混淆,避免被反编译. 1.打开VS,博主所用版本是Visual Studio 2013. 2.新建一个VC项目 ...

  6. imageNamed、imageWithContentsOfFile、imageWithData

    [UIImage imageNamed:ImageName]; 1.加载图片占据的内存较大 2.相同的图片只会加载一份到内存中,如果同时使用,使用同一个对象即可 3.当对象销毁,图片对象不会随着一起销 ...

  7. Java递归输出指定路径下所有文件及文件夹

    package a.ab; import java.io.File; import java.io.IOException; public class AE { public static void ...

  8. getUserMedia

    index.ejs getUserMedia()方法有三个参数: 1.约束对象 2.成功回调函数,传入参数:LocalMediaStream 3.失败回调函数,传入参数:error object &l ...

  9. ftp客户端命令使用简记

    OS:windows8.1评估版 程序和功能 tftp客户端勾选上 Win+R:运行,键入cmd,键入ftp -help 如下图: 使用ftp客户端可以做的事:将文件传送到运行FTP服务器服务(经常称 ...

  10. OWIN的理解和实践(二) – Host和Server的开发

    对于开发人员来说,代码就是最好的文档,如上一篇博文所说,下面我们就会基于Kanata项目的一些具体调用代码,来进一步深入理解OWIN的实现和作用. 今天我们先针对Host和Server来实现一个简单的 ...