首页 > 代码库 > 李洪强和你一起学习前端之(2)表格、表单、标签语义化

李洪强和你一起学习前端之(2)表格、表单、标签语义化

大家早上好!新的一天开始了,学如逆水行舟,不进则退,一起加油吧!

在学习的过程中有任何问题想与我交流的,加我QQ: 990625403

好了,让我们开始今天的学习吧!

 

温故而知新

1 复习昨天的知识

1.1 单标签

<!--文本内容--> 注释标签  Ctrl +/

<br>      换行标签

<hr>      横线标签

1.2 双标签

<p></p>      段落标签

<hn></hn>    n的取值是1-6  标题标签

<font  size = "10" color = "red"></font>

<strong></strong>  <b></b>  文本加粗

<em></em>  i     文本斜体

<ins></ins>  u     文本下横线

<del></del>  s     删除线    

1.3 Img 标签以及属性

 Src属性

Alt属性: 图片无法显示对图片的描述

Title  : 鼠标放在图片上显示的文字

Width: 宽度

Height: 高度

1.4 超链接a以及属性

<a href = "http://www.mamicode.com/02.html"  title = "描述">跳转</a>锚链接

<p id = "db"></p>

<a href = "http://www.mamicode.com/#db">返回顶部</a>

下载:

<a href = "http://www.mamicode.com/1.rar">下载</a>

 

 

1.5列表

无序列表

<ul>

  <li></li>

  <li></li>

  <li></li>

  <li></li>

 

 

</ul>

有序列表

<ol>

  `<li></li>

  <li></li>

  <li></li>

  <li></li>

 

 

</ol>

自定义列表

 

<dl>

  <dt></dt>

  <dd></dd>

  <dd></dd>

  <dd></dd>

 

</dl>

1.6特殊字符

 &lt    <

&gt    >

&nbsp   空格

 

2 新知识

2.1 Meta标签介绍[本次四种用法均在head标签里面]

<meta charset = "utf-8">

Charset:字符集

ASCII

ANSI

Unicode

Gbk

Gb2312

utf-8: 编码格式

<meta name = "keywords"  content = "">

作用: 对网站进行优化的作用 SEO

<meta name = "descroption" content = ""> 对网站的描述

网页重定向

<meta http-equiv = refresh content = "5" url ="http://www.baidu.com">

 

2.2Link标签介绍[本次两种用法均在head里面]

<link rel = "icon" href = "http://www.mamicode.com/favicon.ico">

给网页title中放置小图标

<link rel = "stylesheet" href = "http://www.mamicode.com/1.css">

引入外部样式表

 

2.3表格 (table)

作用: 显示数据

 

组成

  table    定义表格

  tr      行

  td      列(单元格)

 

给大家举个例子:

<table>

  <tr>

    <td>姓名</td>

    <td>班级</td>

    <td>职业</td>

    <td>籍贯</td>

 

  </tr>

</table>

属性介绍:

border: 设置表格边框

width : 设置表格宽度

Height: 设置高度

cellspacing 设置单元格之间的距离

cellpadding: 文字距离单元格之间的距离

bgcolor = "red"

 

李洪强和你一起学习前端之(2)表格、表单、标签语义化