我的HTML笔记

HTML（Hypertext Marked Language）“超文本标记语言”。

1.HTML的声明

<!DOCTYPE html>

2.HTML的基本结构

<!DOCTYPE html>

<html>

<head>

    <title>标题</title>

    <!--meta标签提供有关页面的元信息 -->

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

    <!--link标签定义文档与外部资源的关系，例如样式表 -->

    <link rel="stylesheet" type="text/css" href="../style.css" />

    <!--script标签定义客户端脚本，比如 JavaScript -->

    <script type="text/javascript" src="js/js001.js"></script>

</head>

<body>

内容

</body>

</html>

3.HTML基础标签

注解

<!--文字注释-->

标题

<h1> ～ <h6>

段落

<p>…</p>

分区

<div>…</div>

换行

<br />

水平线

<hr />

4.HTML标签属性

属性	意义
class	规定元素的一个或多个类名
id	规定元素的唯一 id
style	规定元素的行内 CSS 样式
title	规定有关元素的额外信息
tabindex	规定元素的 tab 键次序
hidden	隐藏当前标签，不显示在页面上

5.HTML格式化

标签	意义
`<b>`	定义粗体文本
`<i>`	定义斜体字
`<strong>`	定义加粗
`<sub>`	定义下标字
`<sup>`	定义上标字
`<del>`	定义删除字
`<code>`	定义计算机代码
`<abbr>`	定义缩写
`<acronym>`	定义首字母缩写
`<address>`	定义地址
`<div>`	定义文档中的节或区域（块级）
`<span>`	定义文档中的行内的小块或区域

6.HTML超链接

href属性

    <a href=“http://www. baidu.com”>百度</a>

target属性（_parent,_blank,_self,_top）

    <a href=“http://www. baidu.com” target=_blank >百度</a>

title属性

     <a href=“http://www. baidu.com” title=“搜索引擎” >百度</a>

name属性（要设置一对）

    <a href="#C1">参见第一章</a>

    <a name="C1">第一章</a>

    <a href=“other.html#C1"></a>

7.HTML图像

<img src=“filename” alt=“提示文字” width=“100px” height=“50px” align=“left”>

<a href=“index.html”><img src=“1.jpg”></a>

8.相对路径和绝对路径

相对路径

   <a href = “文件名">同一个目录 </a>

   <a href = “../文件夹名/文件名">上级目录</a>

   <a href = “文件夹名/文件名”>下级目录</a>

绝对路径

指带域名的文件的完整路径。

假设域名www.admin.com ,在www根目录下放了一个文件index.html ，这个文件的绝对路径就是： http://www.admin.com/index.html

9.HTML表格

基本语法

  <table>

           <tr>（行标记）

               <th>…</th>(表头)

               …

           </tr>

           <tr>

               <td>…</td>（单元格标记）

               …

           </tr>

     </table>

<table>标签属性

属性	表示
边框	border
宽度	width
高度	height
边框颜色	bordercolor
背景颜色	bgcolor
单元格间距	cellspacing
单元格边距	cellpadding
对齐	align( left, center, right)
边框式样	frame( above, below, hsides(上下), vsides(左右) )
内部边框式样	rules( all, cols, rows)

<tr> 标签属性

属性	表示
对齐	align( left, center, right) ,vlign( top, middle, bottom)
边框颜色	bordercolor
背景颜色	bgcolor

<td> 与<th> 标签属性

与标记相似, 多出了width, height

属性	表示
跨行	rowspan
跨列	colspan

10. HTML列表

有序列表(Ordered List)

由<ol>开始，每个列表项由<li>开始换行。

属性： reversed，start，type

无序列表(Unordered List)

由<ul>开始，每个列表项由<li>开始换行。

属性： type（disc,circle,square）

<!-- 有序 -->

<ol>

    <li>Coffee</li>

    <li>Milk</li>

</ol>

<!-- 无序 -->

<ul>

    <li>Coffee</li>

    <li>Milk</li>

</ul>

嵌套列表

ul,ol组合嵌套使用

定义列表

自定义列表不仅仅是一列项目，而是项目及其注释的组合。

自定义列表以 <dl> 标签开始。每个自定义列表项以 <dt> 开始。每个自定义列表项的定义以 <dd> 开始。

<dl>

<dt>Coffee</dt>

<dd>Black hot drink</dd>

<dt>Milk</dt>

<dd>White cold drink</dd>

</dl>

11.HTML表单

主要用于采集和提交用户输入的信息

基本语法

    <form name=“formname” method=“method” action=“url” target=“target_win”>

部分<form>内标记

    <input>…</input>

    <select>…</select>

    <option>…</option>

    <textarea>… <textarea>

<input> 标签

 <input type=“域的类型’ name=“域的名称”>

Type属性值

Type属性值	描述
Text	文字域
Password	密码域
File	文件域
Checkbox	复选框
Radio	单选框
Button	按钮
Submit	提交按钮
Reset	重置按钮
Hidden	隐藏域
Image	图像提交按钮

Get &post方法

Get:

get方法是将表单内容附在URL地址后面，对提交信息的长度有限制，不可超过8192个字节，并且不具有保密性，不能传送非ASCII码字符。

Post：

post方法是将表单中的数据包含在表单的主体中一起传送到服务器上的，没有字符的限制，在浏览器的地址栏不显示提交的信息。

当不指明是哪种方式时，默认为get方法。

12.HTML框架

<frameset></frameset>决定如何划分Frame。<frameset>有列分布cols属性和行分布rows属性。

 <frameset cols="25%,75%">

     <frame src="Frame_a.html" scrolling=“yes/no/auto" >

     <frame src="Frame_b.html">

 </frameset>

13.HTML实体

显示结果	描述	实体名称	实体编号
	空格	` `
<	小于号	`<`	`<`
>	大于号	`>`	`>`
&	和号	`&`	`&`
“	引号	`"`	`"`
‘	撇号	`'`(IE不支持)	`'`
￠	分	`¢`	`¢`
£	镑	`£`	`£`
¥	日圆	`¥`	`¥`
€	欧元	`€`	`€`
§	小节	`§`	`§`
©	版权	`©`	`©`
®	注册商标	`®`	`®`
™	商标	`™`	`™`
×	乘号	`×`	`×`
÷	除号	`÷`	`÷`

14.HTML编写规范

元素正确嵌套

空标签也被关闭 <br/>

属性使用小写

属性值用引号包围

我的HTML笔记的更多相关文章

git-简单流程（学习笔记）
这是阅读廖雪峰的官方网站的笔记,用于自己以后回看 1.进入项目文件夹初始化一个Git仓库,使用git init命令. 添加文件到Git仓库,分两步: 第一步,使用命令git add <file ...
js学习笔记：webpack基础入门（一）
之前听说过webpack,今天想正式的接触一下,先跟着webpack的官方用户指南走: 在这里有: 如何安装webpack 如何使用webpack 如何使用loader 如何使用webpack的开发者 ...
SQL Server技术内幕笔记合集
SQL Server技术内幕笔记合集发这一篇文章主要是方便大家找到我的笔记入口,方便大家o(∩_∩)o Microsoft SQL Server 6.5 技术内幕笔记http://www.cnbl ...
PHP-自定义模板-学习笔记
1. 开始这几天,看了李炎恢老师的<PHP第二季度视频>中的“章节7:创建TPL自定义模板”,做一个学习笔记,通过绘制架构图.UML类图和思维导图,来对加深理解. 2. 整体架构图 ...
PHP-会员登录与注册例子解析-学习笔记
1.开始最近开始学习李炎恢老师的<PHP第二季度视频>中的“章节5:使用OOP注册会员”,做一个学习笔记,通过绘制基本页面流程和UML类图,来对加深理解. 2.基本页面流程 3.通过UM ...
NET Core-学习笔记（三）
这里将要和大家分享的是学习总结第三篇:首先感慨一下这周跟随netcore官网学习是遇到的一些问题: a.官网的英文版教程使用的部分nuget包和我当时安装的最新包版本不一致,所以没法按照教材上给出的列 ...
springMVC学习笔记--知识点总结1
以下是学习springmvc框架时的笔记整理: 结果跳转方式 1.设置ModelAndView,根据view的名称,和视图渲染器跳转到指定的页面. 比如jsp的视图渲染器是如下配置的: <!-- ...
读书笔记汇总 - SQL必知必会（第4版）
本系列记录并分享学习SQL的过程,主要内容为SQL的基础概念及练习过程. 书目信息中文名:<SQL必知必会(第4版)> 英文名:<Sams Teach Yourself SQL i ...
2014年暑假c#学习笔记目录
2014年暑假c#学习笔记一.C#编程基础 1. c#编程基础之枚举 2. c#编程基础之函数可变参数 3. c#编程基础之字符串基础 4. c#编程基础之字符串函数 5.c#编程基础之ref.ou ...
JAVA GUI编程学习笔记目录
2014年暑假JAVA GUI编程学习笔记目录 1.JAVA之GUI编程概述 2.JAVA之GUI编程布局 3.JAVA之GUI编程Frame窗口 4.JAVA之GUI编程事件监听机制 5.JAVA之 ...

随机推荐

个人软件过程5 git命令行方式超简洁教程
虽然许多IDE对git的支持不错,但用命令行方式,有助于对git本身的理解.这里对实际工作中,使用git的流程,以及与其相关的命令小结一下,基本上,掌握这些命令,就能自如的在工作中使用. 1.git ...
mongodb存储过程
MongoDB支持存储过程的使用,它的存储过程是用javascript实现的,被存在于system.js表中,可以接收和输出参数,返回执行存储过程的状态值,也可以嵌套调用. 所以我理解的Mon ...
C# 调用 WebService 连接ORACLE 11g
这几天开发一个WebService遇到很多问题,记录下来顺便帮助一下以后遇到情况的人. 我是通过ADO.NET来连接ORACLE的,也可以用ORACLE提供的ODP.NET. 通过正常的连接后部署II ...
对Joint Training of Cascaded CNN for Face Detection一文的几点疑惑
最近读了Joint Training of Cascaded CNN for Face Detection这篇论文,论文中把之前人脸检测使用到的cascade cnn,从分开训练的模式,改为了联合训练 ...
Android 模拟器获得 root权限
启动一个模拟器,开始-运行-输入cmd,打开dos,依次输入 adb shell mount -o remount,rw -t yaffs2 /dev/block/mtdblock3 /system ...
设置zookeeper jvm内存
看了你的问题, 我还特意的查看了ZooKeeper的启动脚本代码.ZooKeeper启动脚本没有加任何参数,也就是使用jvm默认的. 如果想要加大ZooKeeper的JVM使用内存.可以在更改{ZK_ ...
Socket模型详解(转)
两种I/O模式一.选择模型二.异步选择三.事件选择四.重叠I/O模型五.完成端口模型五种I/O模型的比较两种I/O模式 1. 两种I/O模式阻塞模式:执行I/O操作完成前会一直进行等待 ...
使用UIKit制作卡牌游戏（三）ios游戏篇
译者: Lao Jiang | 原文作者: Matthijs Hollemans写于2012/07/13 转自朋友Tommy 的翻译,自己只翻译了这第三篇教程. 原文地址: http://www.ra ...
angularjs + seajs构建Web Form前端(二)
回顾上一篇讲解了引入bootstrap构建一个简单的登录页面,如何让angularjs自动启动并绑定视图,操作过程当中如何使用ui-bootstrap,继而完成简单功能后如何引入seajs后如何使n ...
IIS6.0启动网站ManagedPipelineHandler异常
处理程序“PageHandlerFactory-Integrated”在其模块列表中有一个错误模块“ManagedPipelineHandler” 开发web项目需要安装IIS,当安装完以后,web程 ...

显示结果	描述	实体名称	实体编号
	空格	` `
<	小于号	`<`	`<`
>	大于号	`>`	`>`
&	和号	`&`	`&`
“	引号	`"`	`"`
‘	撇号	`'`(IE不支持)	`'`
￠	分	`¢`	`¢`
£	镑	`£`	`£`
¥	日圆	`¥`	`¥`
€	欧元	`€`	`€`
§	小节	`§`	`§`
©	版权	`©`	`©`
®	注册商标	`®`	`®`
™	商标	`™`	`™`
×	乘号	`×`	`×`
÷	除号	`÷`	`÷`

显示结果	描述	实体名称	实体编号
	空格	` `
<	小于号	`<`	`<`
>	大于号	`>`	`>`
&	和号	`&`	`&`
“	引号	`"`	`"`
‘	撇号	`'`(IE不支持)	`'`
￠	分	`¢`	`¢`
£	镑	`£`	`£`
¥	日圆	`¥`	`¥`
€	欧元	`€`	`€`
§	小节	`§`	`§`
©	版权	`©`	`©`
®	注册商标	`®`	`®`
™	商标	`™`	`™`
×	乘号	`×`	`×`
÷	除号	`÷`	`÷`

我的HTML笔记

我的HTML笔记的更多相关文章

随机推荐

热门专题

显示结果	描述	实体名称	实体编号
	空格	` `
<	小于号	`<`	`<`
>	大于号	`>`	`>`
&	和号	`&`	`&`
“	引号	`"`	`"`
‘	撇号	`'`(IE不支持)	`'`
￠	分	`¢`	`¢`
£	镑	`£`	`£`
¥	日圆	`¥`	`¥`
€	欧元	`€`	`€`
§	小节	`§`	`§`
©	版权	`©`	`©`
®	注册商标	`®`	`®`
™	商标	`™`	`™`
×	乘号	`×`	`×`
÷	除号	`÷`	`÷`