html初识2

认识标签

---

1.用于陈列列表信息的标签

ul-li 是 没有前后顺序的信息列表

<ul>    <li>腾讯</li>    <li>百度</li>    <li>阿里巴巴</li></ul>

• 腾讯
• 百度
• 阿里巴巴

ol-li 是 有顺序的的信息列表 (“o” 可以用”order”来记)

<ol>    <li>太阳</li>    <li>地球</li>    <li>月球</li></ol>

---

2.排版标签 div

div就像一个容器,存放存放各式标签和内容,在排版时,根据亲疏关系使用div进行划分,极其常用.

<div>    <ol>        <li>太阳</li>        <li>地球</li>        <li>月球</li>    </ol></div><div>    <ul>        <li>腾讯</li>        <li>百度</li>        <li>阿里巴巴</li>    </ul></div>

通常我们会对div标签进行命名,使逻辑更加清晰,也方便使用css对其进行修改.

<div id="heavenly_body">    <ol>        <li>太阳</li>        <li>地球</li>        <li>月球</li>    </ol></div><div id="bat">    <ul>        <li>腾讯</li>        <li>百度</li>        <li>阿里巴巴</li>    </ul></div>

---

3.创建表格的标签 table tbody tr th td

table 标记表格的开始与结束.

tbody 加上它后,这个表格要表格要等表格内容全部下载完成才会显示.

tr 表格的一行,有几对tr表格就有几行(单词 “row” ).

td 表格中的一个单元格(“danyuange”拼音”d”,反正我这么记了),一行有几对td ,说明一行有多少列.

th 表格表头,默认会粗体,居中显示.

需要注意的是,表格在不加css样式时,是没有线的,这里演示的样式时,经过处理的.

<table summary="表述了一些人的基本信息"><!--   summary为摘要   --><caption>基本信息表</caption><!--   caption标签为标题   -->  <tbody>    <tr>      <th>姓名</th>      <th>性别</th>      <th>年龄</th>    </tr>    <tr>      <td>张三</td>      <td>男</td>      <td>18</td>    </tr>    <tr>      <td>李四</td>      <td>女</td>      <td>17</td>    </tr>    <tr>      <td>王五</td>      <td>男</td>      <td>19</td>    </tr>  </tbody></table>

基本信息表 姓名 性别 年龄 张三 男 18 李四 女 17 王五 男 19

---

4.超链接标签 a

使用a可以实现超链接,它在网站上很常见,title作用是方便搜索引擎了解链接地址的内容.

需要注意的是,a标签默认样式为蓝色,学习css后,可以对它进行修改

<a  href="目标网址"  title="鼠标滑过显示的文本">链接显示的文本</a><!--以下是一个例子--><a href="http://blog.csdn.net/sumuyunyu/article/details/50390159" title="html初识1">点我转到 html初识1 的页面</a>

点我转到 html初识1 的页面

有时,我们需要在新建浏览器窗口中打开链接,需用到 target

<a href="目标网址" target="_blank">click here!</a><!--以下是一个例子--><a href="http://blog.csdn.net/sumuyunyu/article/details/50390159" title="html初识1" target="_blank">点我转到 html初识1 的页面</a>

点我转到 html初识1 的页面

---

5.链接Email地址

<a href="mailto: 邮箱地址?subject=邮件主题&body=邮件内容">显示内容</a><!--以下是一个例子--><a href="mailto: [e-mail]?subject=交个朋友吧,很喜欢你的文章&body=苏木云雨你好">对我的博客有什么意见或者建议就发送邮件给我吧</a>

对我的博客有什么意见或者建议就发送邮件给我吧

---

6.图片标签

src : 图片的位置
alt : 当图像不可见时(如:下载不成功),可以看到该属性指定的文本.
title : 提供鼠标滑过时,图片显示的文本.

注意图片的格式可以死gif,png,jpeg格式的图片

<img src="图片地址" alt="下载失败时的替换文本" title = "提示文本">

哈哈,这张图被我当桌面了.

---