首页 > 代码库 > HTML学习笔记

HTML学习笔记

HTML 指的是超文本标记语言 (Hyper Text Markup Language)

XHTML 是更严谨更纯净的 HTML 版本。
XHTML 指可扩展超文本标签语言(EXtensible HyperText Markup Language)。
XHTML 是作为一种 XML 应用被重新定义的 HTML。
XHTML 是一个 W3C 标准。
你应该马上使用小写字母编写HTML代码,同时绝不要养成忽略类似 </p> 标签的坏习惯。
XHTML 元素必须被关闭 非空标签必须使用结束标签。

    属性名称必须小写
    属性值必须加引号
    属性不能简写
    用 Id 属性代替 name 属性
    XHTML DTD 定义了强制使用的 HTML 元素


<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

HTML5 是下一代的 HTML。
<!DOCTYPE HTML>

---------------------------------------------------------------------

<blockquote>的作用也是引用别人的文本。但它是对长文本的引用,如在文章中引入大段某知名作家的文字,这时需要这个标签。
    浏览器对<blockquote>标签的解析是缩进样式。
<q>标签,短文本引用
    引号
&nbsp; 空格
<address>标签,为网页加入地址信息
想加入一行代码吗?使用<code>标签 <code>var i=i+300;</code>

如果是多行代码,可以使用<pre>标签。

ul-li是没有前后顺序的信息列表。有前后顺序的信息列表使用ol

创建表格的四个元素:
table、tbody、tr、th、td
<tbody>…</tbody>:当表格内容非常多时,表格会下载一点显示一点,但如果加上<tbody>标签后,这个表格就要等表格内容全部下载完才会显示。如右侧代码编辑器中的代码。

caption标签,为表格添加标题 标题的显示位置:表格上方。

<table summary="表格简介文本">
摘要的内容是不会在浏览器中显示出来的。它的作用是增加表格的可读性(语义化),使搜索引擎更好的读懂表格内容,还可以使屏幕阅读器更好的帮助特殊用户读取表格内容。

使用mailto在网页中链接Email地址
对此影评有何感想,<a href="mailto:yy@imooc.com?subject=观了不起的盖茨比有感&body=你好,对此评论有些想法。">发送</a>邮件给我

<img src="http://www.mamicode.com/图片地址" alt="下载失败时的替换文本" title = "提示文本">

使用表单标签,与用户交互
<form   method="传送方式"   action="服务器文件">

文本输入框、密码输入框 
<input type="text" name="名称" value="http://www.mamicode.com/文本" />
<input type="password" name="密码" value="http://www.mamicode.com/文本" />
文本域,支持多行文本输入
<textarea  rows="行数" cols="列数">文本</textarea>

使用单选框、复选框,让用户选择<input   type="radio/checkbox"   value="http://www.mamicode.com/值"    name="名称"   checked="checked"/>
注意:同一组的单选按钮,name 取值一定要一致

使用下拉列表框,节省空间
<select>
      <option value="http://www.mamicode.com/看书">看书</option>
      <option value="http://www.mamicode.com/旅游">旅游</option>
      <option value="http://www.mamicode.com/运动">运动</option>
      <option value="http://www.mamicode.com/购物">购物</option>
    </select>
设置selected="selected"属性,则该选项就被默认选中
下拉列表也可以进行多选操作,在<select>标签中设置multiple="multiple"属性,就可以实现多选功能,在 widows 操作系统下,进行多选时按下Ctrl键同时进行单击(在 Mac下使用 Command +单击),可以选择多个选项。如下代码:

使用重置按钮,重置表单信息
当用户需要重置表单信息到初始时的状态时,比如用户输入“用户名”后,发现书写有误,可以使用重置按钮使输入框恢复到初始状态。只需要把type设置为"reset"就可以。
<input type="reset" value="http://www.mamicode.com/重置">


form表单中的label标签
label标签不会向用户呈现任何特殊效果,它的作用是为鼠标用户改进了可用性。如果你在 label 标签内点击文本,就会触发此控件。就是说,当用户单击选中该label标签时,浏览器就会自动将焦点转到和标签相关的表单控件上(就自动选中和该label标签相关连的表单控件上)。
<label for="控件id名称">
 

HTML学习笔记