整合营销服务商

电脑端+手机端+微信端=数据同步管理

免费咨询热线:

HTML个人笔记

TML标签:

基本标签:

<html></html>双标签 开头结尾 HTML标签为最大的标签 称为根标签

<head></head> 文档头部标签 且必须设置title

<title></title> 页面标题

<body></body> 文档的主体 包含页面的内容

<h1>-<h6> HTML提供6个等级的页面标题 有大到小

<p></p> p标签用于定义段落 可以将页面分为若干个段落 根据窗口大小自动换行

<br/>单标签 换行标签 (break打断)

格式化标签:

加粗 <strong></strong>or<b></b>

斜线 <em></em>or<i></i>

删除线 <del></del>or<s></s>

下划线 <ins></ins>or<u></u>

div和span标签:

没有语义 属于一种盒子 来装内容

<div></div> 表示分割分区 用来布局 一行一个 大盒子

<span></span>意为跨度,跨距 一行可以哦有多个 小盒子

图像标签:

<img src="图像路径(url)"/> 定义页面中的图像

图像标签包含多个属性

src 图片路径 必须属性

alt 文本 替换文本 图像不能显示的文字

title 文本 鼠标放到图像上显示文字

width 像素 宽度

height 高度

border 边框

相对路径和绝对路径

相对路径:以引用文件所在位置为参考基础,而建立出的目录路径

分类:下级路径/ 上级路径../

绝对路径:是指目录下的绝对位置,如硬盘中的路径或网路地址

超链接标签:

<a href="跳转目标" target="目标窗口的弹出方式">文本或图像</a>

href用于指定链接目标的url地址(必须属性)

target用于指定链接打卡方式 _self为默认值 _blank为在新窗口打开方式

锚点链接:可以快速到页面某个位置

在链接文本中的href属性中,设置属性值为#名字的形式,如<a href="#two">目标</a>

找到目标位置标签,里面添加一个id属性 = 名字,如:<h3 id="two">目标</h3>

注释:

<!-- 注释语句 --> 快捷键CTRL + /

特殊字符:

HTML 原代码

显示结果

描述

<

<

小于号或显示标记

>

>

大于号或显示标记

&

&

可用于显示其它特殊字符

"

引号

®

®

已注册

©

©

版权

商标



半个空白位



一个空白位



不断行的空白

表格标签:

<table></table> 是用于定义表格的标签

<tr></tr> 标签用于定义表格中的行,必须嵌套在<table></table>标签中

<tb></tb> 用于定义表格的单元格,必须嵌套在<tr></tr>标签中

<td> 元素中的文本通常是普通的左对齐文本。字母td指表格数据(table data),即数据单元格的内容

表头单元格标签:

<th>标签表示HTML表格的表头部分 <th> 元素中的文本通常呈现为粗体并且居中。

表格属性:

align left center right 规定表格相对于周围元素的对齐方式
border 1or"" 规定表格单元是否拥有边框默认为"",表示没有边框

cellpadding 像素值 规定单元边沿与其内容的空白,默认1像素

cellspacing 像素值 规定单元格直接的空白 默认2像素

with 像素值or百分比 规定表格的宽度

合并单元表格方式:

跨行合并:rowspan="合并单元格的个数"

跨列合并:colspan="合并单元格的个数"

列表标签:

<ul>标签表示无序列表 里面只能包含li

<ol>有序标签 里面只能包含li

<li>相当于一个容器定义列表项 与<ui>or<li>嵌套使用 li里面可以包含任何标签

<dl>标签用于定义描述列表(或自定义列表),该标签会与<dt>(定义项目和名字)和<dd>(描述每一个项目名字)一起使用

表单标签:

标签

描述

<form>

定义供用户输入的表单

<input>

定义输入域

<textarea>

定义文本域 (一个多行的输入控件)

<label>

定义了 <input> 元素的标签,一般为输入标题

<fieldset>

定义了一组相关的表单元素,并使用外框包含起来

<legend>

定义了 <fieldset> 元素的标题

<select>

定义了下拉选项列表

<optgroup>

定义选项组

<option>

定义下拉列表中的选项

<button>

定义一个点击按钮

<datalist>

New

指定一个预先定义的输入控件选项列表

<keygen>

New

定义了表单的密钥对生成器字段

<output>

New

定义一个计算结果

<input>标签用于收集用户信息 包含一个type属性 可以有多种样式

<input type="value">

<input type="属性值" />

属性值:

button

定义可点击按钮(多数情况下,用于通过 JavaScript 启动脚本)。

checkbox

定义复选框。

file

定义输入字段和 "浏览"按钮,供文件上传。

hidden

定义隐藏的输入字段。

image

定义图像形式的提交按钮。

password

定义密码字段。该字段中的字符被掩码。

radio

定义单选按钮。

reset

定义重置按钮。重置按钮会清除表单中的所有数据。

submit

定义提交按钮。提交按钮会把表单数据发送到服务器。

text

定义单行的输入字段,用户可在其中输入文本。默认宽度为 20 个字符。

<label>标签

<label> 标签为 input 元素定义标注(标记)。 label是标注的意思

label 元素不会向用户呈现任何特殊效果。不过,它为鼠标用户改进了可用性。如果您在 label 元素内点击文本,就会触发此控件。就是说,当用户选择该标签时,浏览器就会自动将焦点转到和标签相关的表单控件上。

<label> 标签的 for 属性应当与相关元素的 id 属性相同


详情可参考

https://www.runoob.com/ 菜鸟教程

https://www.w3school.com.cn/ w3c

一个简单的 HTML 表格,包含两列两行:

<table border="1">

<tr>

<th>Month</th>

<th>Savings</th>

</tr>

<tr>

<td>January</td>

<td>0</td>

</tr>

</table>


浏览器支持

所有主流浏览器都支持 <table> 标签。


标签定义及使用说明

<table> 标签定义 HTML 表格

一个 HTML 表格包括 <table> 元素,一个或多个 <tr>、<th> 以及 <td> 元素。

<tr> 元素定义表格行,<th> 元素定义表头,<td> 元素定义表格单元。

更复杂的 HTML 表格也可能包括 <caption>、<col>、<colgroup>、<thead>、<tfoot> 以及 <tbody> 元素。


HTML 4.01 与 HTML5之间的差异

在 HTML5 中,仅支持 "border" 属性,并且只允许使用值 "1" 或 ""。


属性

属性描述
alignleftcenterrightHTML5 不支持。HTML 4.01 已废弃。 规定表格相对周围元素的对齐方式。
bgcolorrgb(x,x,x)#xxxxxxcolornameHTML5 不支持。HTML 4.01 已废弃。 规定表格的背景颜色。
border1""规定表格单元是否拥有边框。
cellpaddingpixelsHTML5 不支持。规定单元边沿与其内容之间的空白。
cellspacingpixelsHTML5 不支持。规定单元格之间的空白。
framevoidabovebelowhsideslhsrhsvsidesboxborderHTML5 不支持。规定外侧边框的哪个部分是可见的。
rulesnonegroupsrowscolsallHTML5 不支持。规定内侧边框的哪个部分是可见的。
summarytextHTML5 不支持。规定表格的摘要。
widthpixels%HTML5 不支持。规定表格的宽度。

全局属性

<table> 标签支持 HTML 的全局属性。


事件属性

<table> 标签支持 HTML 的事件属性。

如您还有不明白的可以在下面与我留言或是与我探讨QQ群308855039,我们一起飞!

、 结构

一、标记<Html> 建立HTML文档

<Head> 设置网页头部和其它信息

<Body> 设计文件格式及内文所在<Body> 元素的属性

Text 设置页面文字的送顔色 Bgcolor 设置页面背景的顡色

Background 设置页面的背景图像 Link设置页面黙认的顔色

Bgproperties 设置页面的背景图像为固定,不随页面的滚动而滚动

Alink 设置鼠标正在单击时候的链接顔色 Vlink 设置访问过后的链接顔色

Topmargin 设置页面的上边距 Leftmargin 设置页面的左边距

二、头部

标记 <Base> 当前文档的URL全称 <Title>设置显示在浏览器在上方的标题内容

<Isindex> 表明该文档是一个可用于检索的网关脚本

<Meta> 有关文档本身的信息,例如用于查询的关键词,用于获取该文档的有效期等

<Style> 设置CSS层叠样式表的内容

<link> 设置外部文件的链接 <script> 设置页面中程序脚本的内容

<Mate> 标记属性

Http-Equiv 生成一个HTTP标题域,它的取值与另一个属性相同,

例如Http-Equiv=Expires,实际取值由Content确定

Name 如果元数据是以关键字/取值的形式出现的,Name 表示键字,

如Author或ID

Content 关键字/取值的内容

三、文字

文字标记 <HNumber>……<1HNumber> Number=1.2.3.4.5.6

分别指1至6级标题

<Font>文字

文字的修饰标记 <B>/<strong> 粗体 <I>/<Em>/<cite> 斜体

<Sup>上标 <sub>下标 <Big>大字号 <small>小字号

<U>下划线 <S>/<strike>删除线 <Address>地址

<Tt>打字机文字 <Blink>闪烁文字(只适用于Netscape浏览器)

<Code>/<samp>等宽 <kbd>键盘输入文字 <Var>声明变量

<Fant>标记的属性

Face 字体 Size字号 Color顔色

四.列表

列表标记 <Ul>无序列表 <Ol>有序列表 <Dir>回录列表 <Dl>定义列表

<Meru>菜单列表 <Dt>·<Dd>定义列表的标记 <Li>列表项目的标记

<Ul><Ol>标记的属性 Type设置列表类型 start设置列表起始属性

Type的属性值 1 数字 a 小写字母 A 大写字母 i小写罗马数字

I 大写罗马数字 Disc ● Circle ○ square □

五.链接

链接标记 <A> 链接

<A>标记的属性 Href 指定链接地址 Name给链接命名

Title设置链接提示文字 Target指定链接的目标窗口

Target属性值 -parent在上一级窗口中打开。一般使用分帧的框架页会经常使用

-bank在新窗口中打开

-self在同一个帧或窗口中打开.这项一般不用设置

Href属性值 http:// 进入万维网站点 news://启动新闻讨论

ftp:// 进入文件传输服务器 mailto:// 启动新闻讨论组

telnet:// 启动telnet方式 gopher://访问一个gopher服务器

六.图片

图片标记 <Img>图片 <Map>图像映射 <Area>图像映射中定义区域

<lmg>标记的属性 src图像的源文件 Alt提示文字 Width宽度

Height高度 Vspace垂直间距 Hspace水平间距 Align排列 Border边框

Align属性值 Top文字的中间线居于图片上方 Middle文字的中间线居于图片中间

Bottom文字的中间线居于图片底部 Left 图片在文字的左侧

Right图片在文字的右侧 Absbottom文字的底线居于图片底部

Absmiddle文字的底线居于图片中间 Baseline英文文字基线对齐

Texttop英文文字上边线对齐

Shape属性值

Rect矩形区域 Circle椭圆形区域 Poly多边形区域

七.表格

1.表格标记 <Table>…</Table>表格标记 <Tr>…</Tr>行标记

<Td>…</Td>单元格标记 <Th>表头标记

<Table>标记属性 Bordercolor 表格边框色 Borde表格边框的宽度

Bordercolorlight 表格边框亮边框色(左上边框顔色)

Bordercolordark 表格暗边框色(右下边框顔色)

Bordercolor 行的边框顔色 Width表格的宽度 Height表格的高度

Bgcolor表格的背景顔色 Background表格的背图像

<Tr>标记属性 Align行内容的水平对齐 Valign 行内容的垂直对齐

Bgcolor 行的背景顔色 Background 行的背景图像

Bordercolor 行的边框顔色 Bordercolorlight 行的亮边框顔色

Bordercolordark 行的暗边框顔色

<Td>标记属性 Align单元内容的水平对齐 Valign单元格内容的垂直对齐

Bgcolor 单元格的背景顔色 Background 单元格的背景图像

Bordercolor单元格的背景顔色 Bordercorlorlight单元格的亮边框顔色

Brodercolordark 单元格的暗边框顔色 Width 单元格的宽度

Height单元格的高度

<Th>标记属性 Align表头内容的水平对齐 Valign表头内容的垂直对齐

Bgcolor 表头的背景顔色 Background表头的背景图像

Bordercolor表头的边框顔色 Bordercolorlight 表头的亮边框顔色

Bordercolordark 表头的暗边框顔色 Width 表头的宽度 Height 表头的高度

八.表单

1.表单标记 <Form>表单标记 <Input>表单输入标记

<select>菜单和列表标记 <Option>菜单和列表项目标记

2.属性 <Form> Name表单的名称

Method 定义表单结果从浏览器传送到服务器的方法,一般有两种方法:get,post

Action 用来定义表单处理程序(一个Asp,CGI等程序)的位置(相对地址或绝对地址)

<lnput>标记属性 Name 域的名称 Type域的类型

Maxlength 域的最大输入字符数 size域的宽度 Value 域的默认值

<Select>标记属性 Name 菜单和列表的名称 size 显示的选项数目

Multiple 列表中的项目多选 Value 选项值 selected默认选项

<Texrarea>标记属性 Name 文字域的名称 Rows文字域的行数

Cols 文字域的列数 Value 文字域的默认值

Type属性值 Text 文字域 Password 密码域 File 文件域

Checkbox复选框 Redio单选框 Button普通按扭

Submit 提交按钮 Reset重置按钮 Hidden隐藏域Image图像域

九.滚动

滚动标记 <Marquee>

<Marquee>标记属性 Direction 滚动方向 up 文字向上滚动 Left文字向左滚动

Behavior 滚动方式 Scroll 循环往复

Side 只做一次滚动

Alternate 交替进行滚动

ScrollAmount 滚动速度

ScrollDelay 滚动延迟

Trim函数用来剔除首尾空格

十.框架

1.标记 <Frameset> 框架边框标记 <Frame> 框架标记 <Iframe>浮动框架标记

<Frameset>标记属性 Cols列 Rows行

<Frame> 标记属性 src框架中显示页面源文件的路径

FrameBorder 框架边框显标属性 FrameSpacing框架边框宽度属性

Scrolling框架滚动条显示属性 NoResize 框架尺寸调整属性

BorderColor 框架边框顔色属性 MarginWidt 框架边框缘宽度属性

MarginHerght框架边缘高度属性

<1frame> 标记属性 src浮动框架中显示页面源文件的路径

Width 浮动框架的宽度 Height 浮动框架的高度

Name 浮动框架的名称

Align 浮动框架的排列方式 Left表示居左 Center表示居中 Right表示居右

FrameBorder 框架边框显示属性 FrameSpacing 框架宽度属性

Scrolling 框架滚动条显示属性 ( yes显示 No不显示 Auto根据页面的长度自动判断是否晶粒示滚动条

NoResize 框架尺寸调整属性 BorderColor框架的顔色

MarginWidth 框架边缘宽度属性 MarginHeight 框架边缘高度属性

插入刷新

步骤:1.选择"查看/文件头内容"

2.在插入面板上,打开HTML选项卡

优化代码

打开文件窗口,执行"命令、清理HTML"命令

文本换行:Enter 行距较大

Enter + Shift 行距较小

插入水平线设置顔色:单击属性面板中的快捷标签编辑器按钮

在代码中键入"color = #顔色值"

当图像无法显示时将显示这段文字:

图像属性中的替代→输入文字

插入鼠标经过图像:准备两张图像

在文件窗口中,将光标放置于需要翻转图像位置→插入工具栏中单击鼠标经过图像

Ⅱ.使用导航条:

在"常用"对象组中,单击"图像"小三角→导航条

插入图像占位符:图像小三角→图像占位符

Flash动画的背景实现透明 参数wmode 值 transparent

插入 Java Applet

插入表单

插入表单域:对象面板上"表单"→插入表单

插入文本域:单击面板上的插入文本域. 初始值 = 打开时显于的文字

插入密码框:在属性面板上选择密码

插入多行文本域:在类型后选择多行

插入隐藏域:对象面板→插入隐藏域

插入按钮:标签用来设置按钮上显示的文本

插入图像提交按钮=图像域:

插入文件上传按钮=文件域:

插入单选框

插入单选按钮组:Label文字说明 Value 单选按钮的值

插入复选框

菜单/插入列表:列表值→

插入跳转菜单:(

制作网页链接

URL统一资源定位器

目标:_blank在一个新的未命名的浏览器窗口中打开

_parent如果是嵌套的框架,链接会在父框架或窗口中打开,否则=_top

_top在完整的浏览器中打开

创建搜索页

运行中输入:

Inetmgr (IIS

Odbcad32 (odbc

Asp对象

Applicatipn 在给定的应用程序的所有用户间共享信息,并在服务器运行期间持久地保存数据。

集合: Contents

staticObjects

Item(变量值)=设置资料变量的值

Key(变量名称)=设置资料变量的名称

Count(变量资料的数量)=表示

Coutents集合中资料的总数量

方法: Lock

Unlock

事件: Applicatipn_Onstart

Application_OnEnd

Session 存储特定的用户会话所需的信息

属性:CodePage

LCID

SessionID

Timeout

集合:Contents

StaticObjects

方法:Abandon

事件:Session_Onstart

Session_OnEnd

Response 用来控制发送给用户的信息,包括直接发送信息给浏览器,重定位浏览器到另一个URL或设置Cookie值

属性: Buffer

CacheControl

Charset

ContentType

Expires

ExpiresAbsolute

IsClientConnected

PICS

Status

集合: Cookies

方法: AddHeader

AppendToLog

BinaryWrite

Clear

End

Flush

Redirect

Write

Request 访问任何基于HTTP请求传递的信息,常见的有从HTML表单用Post方法或Get方法传递的参数,Cookie或用户认证等。

属性: TotalBytes

集合: ClientCertificate

Cookies

Form

QueryString

ServerVaiables

方法: BinaryRead

Server 提供对服务器方法和属性的访问

属性: ScriptTimeout

集合: 无

方法: CreatObject

HTMLEncode

MapPath

URLEncode

Recordset

MoveNext 将前数据记录移至下一条

MovePrevious 将当前数据记录移至上一条

MoveFirst 将当前数据记录移至第一条

MoveLast 将当前数据记录移至最后一条

AbsolutePosition=N 将当前数据记录移至第N条

EOF 当前数据记录是否移过了最后一条(发生于向下移动时)

BOF 当前数据记录是否移过了第一条 (发生于向上移动时)

VBScript 运算符

算术运算符

指数 取负 乘法 除法 加法 减法 取模 连接 整数除法

∧ - * / ﹢ ﹣ Mod & \

比较运算符

相等 不相等 小于 大于 小于或等于 大于或等于 对象相象

= <> < > <= >= IS

逻辑运算符

逻辑非 逻辑与 逻辑或 异或 逻辑等于 逻辑蕴含

Not And Or Xor Eqv Imp