2024年6月11日发(作者：)

竭诚为您提供优质文档/双击可除

html学习总结

篇一：html学习总结

标签由开始标签和结束标签组成，空的hTmL元

素没有结束标签，比如

没有内容的hTmL

内容被称为空元素。空元素是在开始标签中关闭的。

就是没有关闭标签的空元素（

标签定义换行）。在xhTmL、xmL以及未来版本的hTmL

中，所有元素必须被关闭。在开始标签中添加斜杠，比如

，是关闭空元素的正确方法，hTmL、xhTmL和xmL都接

受这种方式。即使

在所有浏览器中都是有效的，但使用

其实是更长远的保障。

标签及属性值对大小写不敏感： 等同于 。

w3school使用的是小写标签，因为万维网联

1 13

盟（w3c）在hTmL4中推荐使用小写，而在未来(x)hTmL

版本中强制使用小写。属性值应该始终被包括在引号内。双

引号是最常用的，不过使用单引号也没有问题。在某些个别

的情况下，比如属性值本身就含有双引号，那么您必须使用

单引号，例如：name=bill"helloworld"gates

3.标签在hTmL页面中创建水平线。hr元素可用于分隔

内容。

4.可定义一个地址（比如电子邮件地址）。您应当使用

它来定义地址、签名或者文档的作者

身份。

用户服务信箱

上海赢科投资有限公司

金桥开发区789号

5.文本对齐：text-align:center;代替align:center;

属性用于创建被命名的锚（namedanchors）。当

使用命名锚（namedanchors）时，我们可以创

建直接跳至定位至页面中某个节的链接，这样使用者就

2 13

无需不停的滚动页面来寻找他们需要的信息。使用创建锚

usefulTipssection

将#符号和锚名称添加到uRL的末端，就可以直接链接

到tips这个节，就像这样：

JumptotheusefulTipssection

7.

格，定义表格的标题colspan=”3”横跨三列的单元格；

rowspan=”2”横跨两行的单元

cellpadding来创建单元格内容与其边框之间的空白，

cellspacing增加单元格之间的距离。

我的标题

姓名

电话

billgates

55577854

55577855

3 13

8.无序列表ulli有序列表olli自定义列表dldtdd;自

定义列表以标签开始。

每个自定义列表项以开始。每个自定义列表项的定义以

开始。

coffee

blackhotdrink

milk

whitecolddrink

9.

10.文字环绕图片，只需设置图片align=left即可实现

图片在左的文字环绕，align=right可实现图片在右的文字

环绕通过改变img标签的"height"和"width"属性的值，您

可以放大或缩写图像

alt:图像无法载入时，替换文本属性告诉读者们失去的

信息。

11.使用框架导航跳转至指定的节

没有锚的链接

4 13

带有锚的链接

tppabs=".cn/example/html/"name="showframe">

导航框架：

Framea

Frameb

Framec

tppabs=".cn/example/html/frame_"

name="showframe">

12.

xhTmL元素都必须被正确地嵌套，xhTmL必须拥有良好

的结构，所有的标签必须小写，并且所有的xhTmL元素必须

被关闭。xhTmL文档必须拥有DocTYpe声明，并且html、head、

title和body元素必须存在。实现文件的下载

下载链接的文本

必须是exerardoctxt等文件类型

14.去除标签点击时的虚线框：

在css中加入：

a{outline:none;}

5 13

a:active{star:expression_r(s=()

);}

:focus{outline:0;}

网页头部添加

http-equiv="refresh"content="0.1;url=

/Activitycontroller/topage">

当访问该页面时会自动跳转至url所指的页面。

居中的方法：

设置属性：display：block;margin:0auto;推荐

(对于widthheight不确定的图片也适用)

2.给img设一包括img的div,div设置属性

align=center;

17.p设置行间距用line-height设置段间距用

margin-bottom或margin-top

18.返回上一页方法：

如

">

用

几

html学习总结)vascript:(-1);">

图片做的话就是：果是用按钮做的话就是：返回上一页或：

6 13

返回上一页content=这后面是时间。

19.手机端页面宽度设置为：width=960px;电脑端页面

宽度设置为width=1200px

(1)标准手机端页面：用百分比

(2)使用width:320px;

天猫触屏版

7 13

快速定位到页面的某个具体位置：

链接到底部

center

底部

21.输入框提示，鼠标离开提示隐藏

22.当div模块被position:fixed;后她包含的子模块定

义position：absolute,将不起作用

23.当上一个模块元素有浮动时，模块的margin：将不

起作用，解决方法：添加属性clear：both;

24.如何解决浏览器兼容性问题快捷方法之一：

浏览器将会大致以Ie9的模式进行呈现，无论当前浏览

器是何版本

25.自定义鼠标样式

body{cursor:url(/images_icon/),point

er;}

(1)鼠标图片最好是.ico格式的（可使用在线工具转换），

不支持jpg,png，gif格式，其他格式容易有兼容性问题

(2)当自定义鼠标图片无法使用时，会用pointer样式。

8 13

经测试ursor:url(/images_icon/)；只这

样写时鼠标自定义是不

起效的。必须后面加上其他默认样式；最小要求：

16px*16px;32px*32px最好

(3)图片路径要采用绝对路径，否则Ie不识别

26.当给子元素模块添加margin-top:会出现父元素也

偏移，子元素与父元素并没分离问题

解决办法：给包含它的父元素（祖父元素不必设）添加

属性,overflow:hiddden;即可完美解决，这跟bfc的东西（块

级元素格式化上下文）有关

27.

以上样式的实现可用

个人信息用户名：密码：fieldset样式可自定义

28.利用jsonp解决跨域

$.getJson("url?表单数据

if(mobile_==alreadyexist)

{

message="对不起，同一手机号只能办一张卡！

";$("#tx").html(message);}})else{alert("恭喜您，存储

成功")}

例如：

$(function(){

9 13

$("#sub").click(function(){

varmobile_phone=$("#phone").val();

varreg1=/^(^[s]{0,}$)|(((1[0-9]{2})|159)+d{8})$/;

if(mobile_==0){

message="*手机号码不为空！";

篇二：hTmL网页设计学习存在的问题与小结

一：大家在学习hTmL网页设计过程中存在的问题：1：

很多人在一个hTmL页面中写了多对，在一个hTmL页面中，

有且只能有一对，同理，有且只能有一对，一对2：hTmL所

有的标签、元素等全部使用小写3：在hTmL中，

和，没有闭合标签，

和是单个出现的！

的作用是换行，的效果是水平线4：---------，标签是

文章的标题标签，如果不是标题，别用该标签

5:background=""—设置名称为""的图

片为背景图片，这样写，是因为图片和页面在同一级目录下。

如果你要做的背景图片和你的页面不在同一级目录下，这是，

图片名称前面就要加上该图片所在的文件夹的路径：

background="e:/pic/"e盘下的pic文件夹里面的

作为背景图片6：colspan属性用在标签中，用来

指定单元格横向跨越的列数；实例：单元格1单元格2单元

10 13

格3单元格4单元格5效果：单元格1单元格2单元格3单

元格4单元格57：rowspan同上，作用是指定单元格纵向跨

越的行数实例：单元格1单元格2

单元格3单元格4效果：单元格2单元格1单元格3单

元格4二：对上周三、周四课程的总结。1、hTmL页面的基

本组成：2、??部分介绍head标签--代表hTmL文档的

头信息，head标签是成对出现的,以开始,结束头(head)包含

了当前文档的一些信息,例如标题信息,meta信息等,正常情

况下头信息是不会显示在hTmL文档中的.head元素包含的标

签:title标签base标签link标签style标签script标签

meta标签2.1title标签--是hTmL文档的标题，成对出现的,

以开始,结束例：网页标题

2.2meta标签--在head标签中的meta标签,可以为hTmL

文档提供额外信息例如我们之前说过的页面刷新功能，就可

以用该标签解决8秒之后页面自动刷新跳转到“”页

面备注：该标签放在??之间！3、??部分介绍--body定义hTml

文档的主体。??里包含文档的所有内容（比如文本、超链接、

图像、表格和列表等等。）3.1文字链接：汽车效果：点击“汽

车”，页面跳转到备注1：

target="_blank"，作用：在新窗口打开链接页面2：

style="text-decoration:none"，作用：去掉链接文字下的

下划线3.2图片链接：效果：点击“图片”，页面跳转到

11 13

备注1：alt="流氓兔"，作用：alt属性是一个必需的属性，

它规定在图像无法显示时的替代文本。假设由于下列原因用

户无法查看图像，alt属性可以为图像提供替代的信息：网

速太慢src属性中的错误浏览器禁用图像用户使用的是屏幕

阅读器实例如果无法显示图像，浏览器将显示替代文本，就

像这样：4、表格表格的以开始,以结束。一个??就是一行一

个??就是一列colspan是指定单元格横向跨越的列数；

rowspan是指定单元格纵向跨越的行数

篇三：关于html5培训心得总结

关于html5培训心得总结

一：了解hTmL5前端开发技术

hTmL指的是超文本标记语言

(hyperTextmarkupLanguage)，标记语言是一套标记标签

(markuptag)，hTmL使用标记标签来描述网页。hTmL5区别

于hTmL的标准，基于全新的规则手册，提供了一些新的元

素和属性，在web技术发展的过程中成为新的里程碑。hTmL5

被推广用于web平台游戏开发，及手机移动领域，从市场来

看，无论是桌面应用还是移动应用，hTmL5都是当下web技

术中最炙手可热的新宠，是创新的主旋律，在不久的时间里

一定会大有作为。

二：课程能让你学到什么

12 13

从前端开发的基础出发，学习使用hTmL，css，

Javascript等一系列前端技术，实现动画特效。以开发实例

展示为主导，循序渐进让学员掌握hTmL5技术的应用。强化

学员基础，尤其是要针对Javascpript基础的强化从而掌握

hTmL5新功能ApI。

hTmL5培训内容首先是学习hTmL5文档结构和基础语法，

了解hTmL5新特性，css3基础语法和布局样式，图形图像软

件使用等。移动前端的交互Javascript编程基础、

Javascript交互编程实战、Javascript异步操作基础、Ajax、

JQuery、AngularJs使用方法。移动前段综合开发;主要集中

在h5+c3+jQmobile，基于hTmL5的移动网页布局、移动网页

界面样式(css3)、hTmL5本地存储ApI、geolocation地理定

位、智能表单、Video、Audio应用、canvas和sVg的应用、

桌面通知、离线应用、webgL基础及应用(3D网页游戏)、web

前端框架(JQuerymobile、senchaTouch、phonegap)、

cocos2d-hTmL游戏引擎等。最后，项目实训。项目实训能够

提高综合开发能力。

13 13