达内HTML资料Word格式.docx
- 文档编号:20858732
- 上传时间:2023-01-26
- 格式:DOCX
- 页数:26
- 大小:151.12KB
达内HTML资料Word格式.docx
《达内HTML资料Word格式.docx》由会员分享,可在线阅读,更多相关《达内HTML资料Word格式.docx(26页珍藏版)》请在冰豆网上搜索。
元素?
被<
>
/>
尖括号之间的部分都称作元素
属性?
用来修饰元素,每个属性都有值,属性放在标示中
1.<
!
DOCTYPEhtmlPUBLIC"
-//W3C//DTDXHTML1.0Transitional//EN"
http:
//www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"
为了保证兼容性,一般使用过渡性
常用标签
head>
头部<
/head>
title>
标题栏<
/title>
文字将显示在浏览器标题栏
meta>
:
用于设置一些头信息
元素
元素用于定义全局信息
所有其他头元素的容器
紧跟在起始标签<
html>
之后
可包含
Title
Meta
Script
Style
Link
等
头元素<
用于定义文档标题
标题元素的内容出现在浏览器顶部
没有属性
必须出现在<
元素中
一个文档只能有一个标题元素中
用于定义网页的基本信息空标记
段落元素<
p>
/p>
提供了结构化的文本的一种方式
元素中的文本会用单独的段落显示
与前后的文本都换行分开
添加一段额外的垂直空白距离,作为段落间距
常用属性:
align
换行元素<
手动换行
分区元素<
span>
和<
div>
分区元素用于元素分组,常用于页面布局
块分区元素:
/div>
行内分区元素:
/span>
--设置同一行文字内的不同格式
行内元素和块级元素
块级元素
默认情况下,块级元素会独占一行,即元素前后都会自动换行
hn>
行级元素
出现在句子中<
a>
"
htttp-equiv"
指明下面要设置的属性
content"
指明该属性所要设置的内容
metahttp-equiv="
refresh"
content="
3;
url="
在3秒钟之后要刷新当前页面,刷新之后指向的网址
如果对refresh属性不填充任何内容信息的话,页面每隔三秒钟(不跳转)刷新一次
content-type"
text/htmlcharset=gb2312"
Content-type是发送消息头告知浏览器解释当前页面编辑的格式
metaname="
keywords"
beauty"
Keywords是专门写给浏览器看的设置关键字以及关键字的内容今后如果在浏览器上打上beauty就会自动搜索设置的跳转的网页
description"
Thepagetoshowthemetas"
对当前网页的描述
expires"
0"
不要对网页进行缓存
Expires过期告知浏览器0秒就过期了,也就相当于无法进行缓存
metahtt[-equiv="
prama"
no-cache"
不要在我们的代理服务器上进行缓存
generator"
ultraedit"
指定文件是由什么软件生成的
author"
me"
指定作者是谁
copyright"
donotuserthisnamewithoutmypermission"
指定版权声明指定没有我的允许不能使用该网页浏览网页的用户将不能对该网页进行保存到本地
style>
定义Css格式<
/style>
Scriptlanguage="
用于定义脚本<
/Script>
hrnoshadecolor="
#ff00ff"
width="
600"
size="
5"
align="
left"
Noshade没有阴影
Color设置颜色
Width设置宽度
Size大小
Align="
左对齐
标题字体的大小<
h#>
按照标题级别用黑体字显示标题内容
自动插入空行
h1>
最大
h6>
最小
字体设置
fontface="
color="
.....<
/font>
Face定义字体类型/宋体微软雅黑
Size1234567
Color通常可以使用预定义的名字,也可以使用数字
tt>
/tt>
通常是打字机风格的字体
cite>
/cite>
通常是引用方式(斜体)
em>
/em>
强调(通常是斜体加粗)
通常改变字体用到的是CSS而不是font标签
i>
/i>
斜体
b>
/b>
黑体
u>
/u>
下划线
s>
/s>
中划线
blink>
/blink>
闪烁效果
sup>
/sup>
上标
sub>
/sub>
下标
特殊字符
&
lt;
<
gt;
>
reg注册商标
amp;
&
nbsp;
空格
copy;
copyright
trade;
商标TM
quot;
文字的布局
分段落显示
分块显示
url>
/url>
符号列表
ol>
/ol>
数字列表
换行
nobr>
/nobr>
不换行
pre>
/pre>
保留原有格式
marquee>
/marquee>
跑马灯效果
blockquote>
/blockquote>
黑体引用
其中url必须和li结合在一起使用
li>
type="
circle"
/li>
显示实心圆
square"
显示空心圆
如果<
/br>
中间的内容足够多了,系统会自动换行,但是如果添加<
再长的文字也不会换行
对齐
h1align=“”>
divalign="
tablealign="
hralign="
取值:
leftrightcentertopmiddlebottom
图片的显示
alt="
border="
Src图片路径一般使用相对路径
Alt图片无法显示时显示的文字
Border边框的宽度
Align=leftrighttopmiddlebottom
图文混在一起时,用于对图片的对齐
Bgsound
是音频标签
特点:
不能写入body里,只能写入head,有src属性可以指定属性文件
针对于flash格式的视频文件,虽然在超文本标记语言有所对应的标签,但是在浏览器上无法显示,因为flash并不是浏览器所要提供的功能.
在pluginspage元素中,如果给定一个下载插件的链接地址的话,浏览器在没有实现flash功能的前提下,会自动跳转到给定地址,下载插件
object>
标签经常被使用于播放影音文件,比较常用。
通用性好,但是必须和javascript配合使用
总复习
标记语法:
-HTML用于描述功能的符号称为"
标记"
比如<
-标记在使用时必须使用尖括号括起来,有些标记还必须成对出现
标记会导致不同的显示效果
封闭类型标记
-<
标记>
/标记>
标记属性1=“值”属性2=“值”>
这是标题<
/h1>
ptitile="
这里有一个段落"
段落1<
封闭类型必须成对出现
如果一个应该被封闭在段落里的没有被封闭,则产生意料不到的错误
一个标记可能不只有一个属性,多个属性之间用逗号间隔
非封闭类型标记,也叫做空标记
不需要结束标记
属性和元素
每一对尖括号包围的部分,如
body>
/body>
包围的部分就叫做body元素
属性
-用来修饰元素
-每个属性都有值
-属性都必须放在开始标记中
palign="
center"
段落<
开始标记和结束标记
Center属性
整体就叫做body元素
Html页面
文件头<
文档主体部分<
版本信息---
文件头
文件主体
在文档的起始启用版本信息声明指定的版本和风格--
为了让浏览器清楚文档的版本,类型和风格
用于为页面定义全局信息
里面可以跟所有其他元素的信息
紧跟在起始元素<
-title
-meta
-Script
-style
-link等
头元素-<
标题元素<
用于为文档定义标题
-标题元素的内容出现在浏览器顶部
-没有属性
-必须出现在<
-一个文档只能有一个标题元素
我的第一个HTML页面<
-元数据元素<
用于定义网页的基本信息
-为空标记
-常用属性:
contenthttp-equiv
10"
/>
text/html;
chatrset=utf-8"
文本标记的作用
文本是网页上的基本成分
直接书写的文本会用浏览器默认的样式显示
包含在标记中的文本则会被显示为标记所有的样式
-特殊字符
-注释
-标题元素
-段落元素
-换行元素
-分区元素
文本与特殊字符
空格折叠
-多个空格或制表符压缩成单个空格,即只显示一个空格
-特殊字符(即空格),可以使用转义字符,也称作字符实体
The&
p&
element.&
2011bytarena
标题元素
h2>
标题元素往往用于文章段落的标题
~<
按照字体的大小123456
段落元素
元素提供了结构化文本的一种方式
-前后的文本都换行分开
-添加一段额外的垂直空白距离,作为段落间距
使用<
元素在任何地方创建手工换行
-和meta一样都属于空标记
Thisisa<
paragraph<
-分区元素用于元素分组,常用于页面布局
-块分区元素:
divstyle="
color:
blue;
first
second
一周畅销<
spanstyle="
red;
榜<
-默认情况下,块级元素会独占一行,即元素前后都会自动换行
如:
-出现在句子中,不会换行
-如:
行内元素与其他元素位于同一行,常用于分开一行中的某些文本
图像与链接
使用img元素将图像添加到页面
-空标记
必须属性:
src
widthheight
imgwidth="
100"
src="
image/rosejpg"
链接元素<
元素创建了一个超级链接,语法如下:
ahref="
target"
="
文本<
/a>
-href属性:
链接URL
-target属性:
目标,可取值为_blank_self等
.hk"
ToGoogle<
br/>
teacher.asp"
target="
_blank"
Tootherpage
URL
URL:
统一资源定位器,用来标示网络中的任何资源
-文本,图片,音视频文件,段落,或其他超文本文件
完成URL的组成
-协议,机名,路径名,文本名
URL中路径名表示方法有
-相对路径
-绝对路径
锚点
锚点是文档中某行一个记号
-用于链接到文档的第一行
定义锚点
aname="
anchroname1"
锚点一<
链接到锚点:
在锚点名前加上#
#anchorname1"
回到锚点一<
top"
#top"
returntotop<
使用链接导航至锚点
列表标记
列表的作用
列表时指将具有相似特征或者具有先后顺序的几行文字进行对齐排列
所有的列表都由列表类型和列表组成
-列表类型:
有序列表<
和无序列表<
ul>
-列表项:
用于指示具体的列表内容
无序列表
元素表示无序列表,用于列出页面上没有特定次序的一些项目
元素中只能包含具体的列表项元素<
-列表中包含的每一项都必须包含起始标记
和结束标记<
之间
one<
two<
three<
/ul>
有序列表
元素编写有序列表,用于列出页面上有
特定次序的一些项目
元素中也只能包含列表项元素<
列表的嵌套
将列表元素嵌套使用,可以创建多层列表
-常用于创建文档大纲,导航菜单等
Web基础知识
Web工作原理<
表格
表格的作用
表格通常用来组织结构化的信息
表格是一些被称作单元格的矩形框按照从左到右,从上到下的顺序排列在一起形成的
表格的数据保存在单元格里
-显示表格数据
-设置页面布局
创建表格
定义表格:
使用成对的<
table>
/table>
标记
创建表行:
tr>
/tr>
创建单元格:
td>
/td>
3、常用属性
table:
border/width/height/align
td:
width/height/align(left、right、center)/valign(top、middle、bottom)
不规则表格:
td的colspan/rowspan属性,设置单元格跨列或者跨行
tableborder="
1"
第一行,第一列<
第二行,第二列<
第二行,第一列<
th>
/th>
一般在<
中使用,替换<
表格单元中的文字居中显示,并且加粗
Frameset框架
(如果根据需求需要把窗体拆分为两个部分,左边是占用窗体30%的部分,右边是剩余的部分--需要用frameset)
主要属性:
src指定在<
iframe>
中显示的文档的URL
Frame用来做窗体拆分的标签。
注意:
分帧页面不能写body因为frameset在文本标签内是独立存在的
Frame属性
Frameborder0(代表没有边框)|1(代表有边框)
Resize改变大小
Noresize不能改变大小
Scrolling是否可以滚动auto按照需要自动滚动yes可以滚动no不可以滚动
案例:
创建frameset.html文件
charset=utf-8"
framesetcols="
30%,*"
拆分浏览器的参数设定按列拆分
--用frame引入两个文件-->
framesrc="
menu.html"
name="
定义标签通用元素name逻辑名
指定所要导入的文件的窗体显示布局
welcome.html"
right"
对第二个窗体进行初始化,默认显示
/frameset>
/html>
为了保证frameset.html文件中导入的menu文件不能为空,所以要创建menu.html文件
创建menu.html文件
charset=utf-8"
page1.html"
target="
page1<
告知显示文件的内容,
还有在welcome.html显示的帧页上显示。
page2.html"
page2<
同上
因为在定义menu.html文件中已经定义了page1.html和page2.html文件。
所以依然得保证不能为空。
还要定义新的文件
Thisispage1.htmlpage1.html显示内容
Thisispage2.html显示page2.html显示的内容
定义第二个窗体显示welcome.html(右边)
HelloWorld<
Frameset嵌套
framesetrows="
20%,*,5%"
按照行来设置头,身,脚的页面布局
引入文件,要求对"
20%"
的那一行进行初始化.
15%,*,30%"
头"
执行完后,执行内部frameset后,中间层的frameset是按照列的执行的。
02_.html"
中间层执行完后,执行外层frameset的"
脚"
一般在设计主页的时候给scrolling设置no属性
浏览器在访问Frame标签会产生几次的请求和响应呢?
在客户端通过浏览器的url向服务器发送请求的时候,服务器会以一个http的数据包返回给浏览器,数据包就是若干个文本文件(html,文档)文档里的若干个标签,浏览器会负责进行解析,通过解析以图形界面的方式通过浏览器反馈给用户,但是如果标签内含有图片或者音频文件(浏览器只负责解析标签)此时,浏览器会再次发送请求,告知服务器再次把图片反馈过来,服务器会进行针对图片作为响应,传回给
- 配套讲稿:
如PPT文件的首页显示word图标,表示该PPT已包含配套word讲稿。双击word图标可打开word文档。
- 特殊限制:
部分文档作品中含有的国旗、国徽等图片,仅作为作品整体效果示例展示,禁止商用。设计者仅对作品中独创性部分享有著作权。
- 关 键 词:
- HTML 资料
![提示](https://static.bdocx.com/images/bang_tan.gif)