html学习总结docWord文档格式.docx

上传人:b****3 文档编号:16569129 上传时间:2022-11-24 格式:DOCX 页数:7 大小:21.36KB
下载 相关 举报
html学习总结docWord文档格式.docx_第1页
第1页 / 共7页
html学习总结docWord文档格式.docx_第2页
第2页 / 共7页
html学习总结docWord文档格式.docx_第3页
第3页 / 共7页
html学习总结docWord文档格式.docx_第4页
第4页 / 共7页
html学习总结docWord文档格式.docx_第5页
第5页 / 共7页
点击查看更多>>
下载资源
资源描述

html学习总结docWord文档格式.docx

《html学习总结docWord文档格式.docx》由会员分享,可在线阅读,更多相关《html学习总结docWord文档格式.docx(7页珍藏版)》请在冰豆网上搜索。

html学习总结docWord文档格式.docx

text-align:

center;

代替align:

6.Name属性用于创建被命名的锚(namedanchors)。

当使用命名锚(namedanchors)时,我们可以创

建直接跳至定位至页面中某个节的链接,这样使用者就无需不停的滚动页面来寻找他们需要的信息。

使用a创建锚

aname=tipsUsefulTipsSection/a

将#符号和锚名称添加到URL的末端,就可以直接链接到tips这个节,就像这样:

ahref=.cn/html/html_links.asp#tips

JumptotheUsefulTipsSection

/a

7.

格,caption定义表格的标题colspan=”3”横跨三列的单元格;

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

Cellpadding来创建单元格内容与其边框之间的空白,Cellspacing增加单元格之间的距离。

tableborder=6

caption我的标题/caption

tr

th姓名/th

thcolspan=2电话/th

/tr

tdBillGates/td

td55577854/td

td55577855/td

/tr/table

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

自定义列表以dl标签开始。

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

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

dl

dtCoffee/dt

ddBlackhotdrink/dd

dtMilk/dt

ddWhitecolddrink/dd

/dl

9.

10.文字环绕图片,只需设置图片align=left即可实现图片在左的文字环绕,align=right可实现图片在右的文字环绕通过改变img标签的height和width属性的值,您可以放大或缩写图像

imgsrc=eg_mouse.jpgwidth=128height=128alt=”鼠标图片”/

alt:

图像无法载入时,替换文本属性告诉读者们失去的信息。

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

ahref=link.htmltppabs=.cn/example/html/link.htmltarget=showframe没有锚的链接/abr

ahref=link.html#C10tppabs=.cn/example/html/link.html#C10target=showframe带有锚的链接/a

framesrc=../example/html/link.html

tppabs=.cn/example/html/link.htmlname=showframe

导航框架:

ahref=frame_a.htmltppabs=.cn/example/html/frame_a.htmltarget=showframeFramea/abr

ahref=frame_b.htmltppabs=.cn/example/html/frame_b.htmltarget=showframeFrameb/abr

ahref=frame_c.htmltppabs=.cn/example/html/frame_c.htmltarget=showframeFramec/a

framesrc=../example/html/frame_a.html

tppabs=.cn/example/html/frame_a.html

name=showframe

12.

XHTML元素都必须被正确地嵌套,XHTML必须拥有良好的结构,所有的标签必须小写,并且所有的XHTML元素必须被关闭。

XHTML文档必须拥有DOCTYPE声明,并且html、head、title和body元素必须存在。

13.html实现文件的下载

ahref=文件路径/文件名下载链接的文本/a

必须是exerardoctxt等文件类型

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

在css中加入:

a{outline:

none;

}

a:

active{star:

expression_r);

:

focus{outline:

0;

}

15.html网页头部添加

meta

http-equiv=refreshcontent=0.1;

url=

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

16.img居中的方法:

1.img设置属性:

display:

block;

margin:

0auto;

推荐

2.给img设一包括img的div,div设置属性align=center;

17.p设置行间距用line-height设置段间距用margin-bottom或margin-top

18.返回上一页方法:

a

meta秒钟后自动返回上一页代码:

http-equiv=refreshcontent=3;

url=javascript:

window.history.go;

图片做的话就是:

imgsrc=图片路径border=0onclick=javascript:

history.back;

title=返回上一页果是用按钮做的话就是:

inputtype=buttonname=Submitonclick=javascript:

value=返回上一页href=javascript:

history.back返回上一页/a或:

ahref=javascript:

;

onClick=javascript:

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

19.手机端页面宽度设置为:

width=960px;

metaname=viewportcontent=width=960,initial-scale=0.33电脑端页面宽度设置为width=1200px

标准手机端页面:

METAname=viewportcontent=width=device-width,initial-scale=1.0minimum-scale=1.0,maximum-scale=1.0,user-scalable=no用百分比

使用width:

320px;

!

DOCTYPEhtml

html

head

metacontent=text/html;

charset=utf-8http-equiv=Content-Type/

metacharset=utf-8/

title天猫触屏版/title

metacontent=width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0name=viewport/metacontent=yesname=apple-mobile-web-app-capable/

metacontent=blackname=apple-mobile-web-app-status-bar-style/

metacontent=telephone=noname=format-detection/

linkhref=page.cssrel=stylesheettype=text/css/

/head

body

divid=wrapperstyle=width:

100%;

height:

auto;

overflow:

hidden;

divid=headerstyle=width:

90%;

30px;

background-color:

#930;

min-width:

/div

divid=mainstyle=width:

/div

/div/body

/html

20.html快速定位到页面的某个具体位置:

ahref=#bottom链接到底部/a

divstyle=height:

1000px;

center/div

divstyle=border:

1pxsolid#F00;

height:

100px;

id=bottom底部/div

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

inputtype=textid=phonename=phonemaxlength=13value=为你保密哒onfocus=if{value=;

this.style.color=#000}onblur=if{value=defaultValue;

this.style.color=#999}/

22.当div模块被position:

fixed;

后她包含的子模块定义position:

absolute,将不起作用

23.当上一个模块元素有浮动时,模块的margin:

将不起作用,解决方法:

添加属性clear:

both;

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

metahttp-equiv=X-UA-Compatiblecontent=IE=EmulateIE9/

浏览器将会大致以IE9的模式进行呈现,无论当前浏览器是何版本

25.自定义鼠标样式

body{cursor:

url,pointer;

鼠标图片最好是.ico格式的(可使用在线工具转换),不支持jpg,png,gif格式,其他格式容易有兼容性问题

当自定义鼠标图片无法使用时,会用pointer样式。

经测试ursor:

url;

只这样写时鼠标自定义是不

起效的。

必须后面加上其他默认样式;

最小要求:

16px*16px;

32px*32px最好

图片路径要采用绝对路径,否则IE不识别

26.当给子元素模块添加margin-top:

会出现父元素也偏移,子元素与父元素并没分离问题

解决办法:

给包含它的父元素(祖父元素不必设)添加属性,overflow:

hiddden;

即可完美解决,这跟bfc的东西(块级元素格式化上下文)有关

27.

以上样式的实现可用

fieldsetstyle=border:

1pxsolidredlegendstyle=margin-left:

20px个人信息/legenddivlabel用户名:

/labelinputtype=text//divdivlabel密码:

/labelinputtype=password//div/fiel{

message=*手机号码不为空!

篇二:

HTML网页设计学习存在的问题与小结

一:

大家在学习HTML网页设计过程中存在的问题:

1:

很多人在一个HTML页面中写了多对body/body,在一个HTML页面中,有且只能有一对body/body,同理,有且只能有一对head/head,一对html/html2:

HTML所有的标签、元素等全部使用小写3:

在HTML中,br和hr,没有闭合标签,br和hr是单个出现的!

br的作用是换行,hr的效果是水平线4:

h1--h1-----h6--h6,h标签是文章的标题标签,如果不是标题,别用该标签5:

background=Vista.jpg—设置名称为Vista.jpg的图片为背景图片,这样写,是因为图片和页面在同一级目录下。

如果你要做的背景图片和你的页面不在同一级目录下,这是,图片名称前面就要加上该图片所在的文件夹的路径:

background=E:

/pic/Vista.jpgE盘下的pic文件夹里面的Vista.jpg作为背景图片6:

colspan属性用在td标签中,用来指定单元格横向跨越的列数;

实例:

tableborder=1trtdcolspan=2单元格1/tdtd单元格2/td/trtrtd单元格3/tdtd单元格4/tdtd单元格5/td/tr/table效果:

单元格1单元格2单元格3单元格4单元格57:

rowspan同上,作用是指定单元格纵向跨越的行数实例:

tableborder=1trtdrowspan=3单元格1/tdtd单元格2/td

/trtrtd单元格3/td/trtrtd单元格4/td/tr/table效果:

单元格2单元格1单元格3单元格4二:

对上周三、周四课程的总结。

1、HTML页面的基本组成:

htmlhead?

?

/headbody?

/body/html2、head?

/head部分介绍head标签--代表HTML文档的头信息,head标签是成对出现的,以head开始,/head结束头包含了当前文档的一些信息,例如标题信息,meta信息等,正常情况下头信息是不会显示在HTML文档中的.head元素包含的标签:

title标签base标签link标签style标签script标签meta标签2.1title标签--是HTML文档的标题,成对出现的,以title开始,/title结束例:

htmlheadtitle网页标题/title

/headbody/body/html2.2meta标签--在head标签中的meta标签,可以为HTML文档提供额外信息例如我们之前说过的页面刷新功能,就可以用该标签解决metahttp-equiv=refreshcontent=8;

url=1.html8秒之后页面自动刷新跳转到“1.html”页面备注:

该标签放在head?

/head之间!

3、body?

/body部分介绍--body定义HTMl文档的主体。

body?

/body里包含文档的所有内容(比如文本、超链接、图像、表格和列表等等。

)3.1文字链接:

ahref=target=_blankstyle=text-decoration:

none汽车/a效果:

点击“汽车”,页面跳转到备注1:

target=_blank,作用:

在新窗口打开链接页面2:

style=text-decoration:

none,作用:

去掉链接文字下的下划线3.2图片链接:

ahref=1.htmlimgsrc=1.gifalt=流氓兔/a效果:

点击“图片”,页面跳转到1.html备注1:

alt=流氓兔,作用:

alt属性是一个必需的属性,它规定在图像无法显示时的替代文本。

假设由于下列原因用户无法查看图像,alt属性可以为图像提供替代的信息:

网速太慢src属性中的错误浏览器禁用图像用户使用的是屏幕阅读器实例ahref=”1.html”imgsrc=/i/eg_tulip.jpgalt=上海鲜花港-郁金香/a如果无法显示图像,浏览器将显示替代文本,就像这样:

4、表格表格的以table开始,以/table结束。

一个tr?

/tr就是一行一个td?

/td就是一列colspan是指定单元格横向跨越的列数;

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

篇三:

关于html5培训心得总结

关于html5培训心得总结

了解HTML5前端开发技术

HTML指的是超文本标记语言,标记语言是一套标记标签,HTML使用标记标签来描述网页。

HTML5区别于HTML的标准,基于全新的规则手册,提供了一些新的元素和属性,在web技术发展的过程中成为新的里程碑。

HTML5被推广用于Web平台游戏开发,及手机移动领域,从市场来看,无论是桌面应用还是移动应用,HTML5都是当下Web技术中最炙手可热的新宠,是创新的主旋律,在不久的时间里一定会大有作为。

二:

课程能让你学到什么

从前端开发的基础出发,学习使用HTML,CSS,JavaScript等一系列前端技术,实现动画特效。

以开发实例展示为主导,循序渐进让学员掌握HTML5技术的应用。

强化学员基础,尤其是要针对JavaScpript基础的强化从而掌握HTML5新功能API。

HTML5培训内容首先是学习HTML5文档结构和基础语法,了解HTML5新特性,CSS3基础语法和布局样式,图形图像软件使用等。

移动前端的交互JavaScript编程基础、JavaScript交互编程实战、JavaScript异步操作基础、Ajax、JQuery、AngularJS使用方法。

移动前段综合开发;

主要集中在H5+C3+jQMobile,基于HTML5的移动网页布局、移动网页界面样式、HTML5本地存储API、Geolocation地理定位、智能表单、Video、Audio应用、canvas和SVG的应用、桌面通知、离线应用、webGL基础及应用、WEB前端框架、Cocos2d-HTML游戏引擎等。

最后,项目实训。

项目实训能够提高综合开发能力。

展开阅读全文
相关资源
猜你喜欢
相关搜索

当前位置:首页 > 医药卫生 > 药学

copyright@ 2008-2022 冰豆网网站版权所有

经营许可证编号:鄂ICP备2022015515号-1