我的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之 ...

随机推荐

iOS开发 - AVPlayer实现流音频边播边存
边播边下有三套左右实现思路,本文使用AVPlayer + AVURLAsset实现. 概述 1. AVPlayer简介 AVPlayer存在于AVFoundation中,可以播放视频和音频,可以理解为 ...
WEB系统启动时加载Log4j的配置文件
如何在系统启动的时候加载log4j的配置文件呢? 1.自定义监听类并且继承“ServletContextListener”接口: package cn.ibeans.common; import ja ...
css3彩色进度条
<html> <head> <title>progress</title> <script type=" ...
Microsoft 2013 新技术学习笔记四
在继续学习Model的实践经验之前,先思考一下Controller和View的实践原则在本次系统重构中的应用,我手上是一个后台管理系统(不是门户系统.不是具体业务系统),通俗点讲就是给企业的运维人员用 ...
POJ 1308 Is It A Tree?
Is It A Tree? Time Limit: 1000MS Memory Limit: 10000K Total Submissions: 18778 Accepted: 6395 De ...
Tomcat自动部署
在Tomcat的server.xml配置文件中部署 1.在Tomcat下,找到conf文件下的server.xml,打开. 2.在<Host>和</host>之间加上如下代码: ...
Inkpad中文翻译已合并到官方项目
今天 Steve Sprang 已合并了#100提交请求,Inkpad即将在AppStore上发布简体中文版了! 20天前因一个偶然原因启动翻译的: 当晚(周六)我想对iPad上的矢量绘图软件进行交互 ...
用户无法进入SDSF，报NO GROUP ASSIGNMENT错误
注:命令行小写部分表出需要根据自己的情况改变!! a)激活SDSF资源类 SETROPTS CLASSACT(SDSF) b)查看SDSF资源类的PROFILE RLIST SDSF * c)如果不存 ...
ArcGIS Server注册地理数据库报machine:机器名[Oracle:(null)]错误的修改
环境介绍:本机安装了ArcGIS Server10.2,ArcGIS Desktop10.2,64位Oracle11g以及Oracle32位客户端.直连和服务连接都能成功. 问题:我要进行服务发布的时 ...
关于在for循环中绑定事件打印变量i是最后一次。
其实函数引用的外部变量都是最后一次的值. <!DOCTYPE html> <html lang="en"> <head> <meta ch ...

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

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

我的HTML笔记

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

随机推荐

热门专题

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