HTML基本语法

合集下载

html中后代选择器,子选择器,相邻选择器,同辈选择器的基本语法

html中后代选择器,子选择器,相邻选择器,同辈选择器的基本语法

在HTML中,后代选择器、子选择器、相邻选择器和同辈选择器是用于选择特定元素及其子元素、后代、相邻元素以及与其同辈元素的方法。

这些选择器在CSS中非常有用,可以帮助我们更精确地控制网页的样式。

以下是这些选择器的基本语法:1. 后代选择器(Descendant Selector): 后代选择器用于选择某个元素的后代元素。

它的基本语法是`element1 > element2`,其中`element1`是父元素,`element2`是其后的子元素。

例如,假设我们有一个`<div>`元素,它有一个`<p>`元素作为其子元素,我们可以使用后代选择器来选择这个`<p>`元素:```html<div><p>这是一段文本。

</p></div>```在这种情况下,如果我们想改变这段文本的颜色,我们可以使用后代选择器:```cssdiv p {color: blue;}```这会将`<p>`元素的文字颜色设置为蓝色。

2. 子选择器(Child Selector): 子选择器用于选择某个元素的直接子元素。

它的基本语法是`element1 + element2`,其中`element1`是其前一个兄弟元素的直接子元素,而`element2`是其同辈元素中的某个元素。

例如,如果我们有一个段落元素,它紧跟在一个标题元素后面,我们可以使用子选择器来选择这个段落:```html<h2>这是一个标题</h2><p>这是一段文本。

</p>```在这种情况下,如果我们想改变这段文本的颜色,我们可以使用子选择器:```cssh2 + p {color: red;}```这会将紧跟在标题后面的所有文本的颜色设置为红色。

3. 相邻选择器(Adjacent Sibling Selector): 相邻选择器用于选择紧接在另一个元素后面的同辈元素。

第2章 html基础语法

第2章 html基础语法

第2章目录
第2章 HTML语言基础 HTML语言基础
六、超链接标记
链接-当前页面与其他相关页面间的联结关系;链 接的目标可以是任何图像和文件。若浏览器能识别就显 示,不能识别就下载 格式:<A>…</A> 功能:在当前页面和其他页面间建立链接。 主要属性见附表。 【举例2 【举例2-7】超级链接
第2章目录
第2章目录
功能:分区显示文档(布局)
第2章 HTML语言基础 HTML语言基础
说明:在一个文本块或许多段落中设置布局(对齐) 方式,经常使用DIV,它可以将文档内容分成区块一次 性地布局
注意:★若单个align属性出现在DIV内的标题或段 注意:★若单个align属性出现在DIV内的标题或段 落中,这些值将使全局变量DIV的设置无效 落中,这些值将使全局变量DIV的设置无效 ★DIV不是段落类型,故DIV应与其它标记配 DIV不是段落类型,故DIV应与其它标记配 合使用( 合使用(如P、Hn、UL、BLOCKQUOTE等) Hn、UL、BLOCKQUOTE等 ★也可以用CENTER代替DIV 也可以用CENTER代替DIV
第2章目录
【举例2 【举例2-4】文本标记综合示例
第2章 HTML语言基础 HTML语言基础
四、列表格式标记
1、有序列表 格式:<OL type=“符号类型”> <LI type=“符号类型”>……</LI> <LI type=“符号类型”>……</LI> …… </OL> 功能:建立有序列表
第2章目录
第2章目录
【举例】<Br>标记 【举例】<Br>标记
第2章 HTML语言基础 HTML语言基础

HTML初级知识点总结,最详细的总结

HTML初级知识点总结,最详细的总结

HTML超文本标记语言,一种规范预定义,已经定义好的各种标记,只需要我们把对应的标记放到合适的位置一. HTML基本语法与基本结构(重点)标记的使用1、标记一般成对出现,包含开始标记和结束标记2、标记可以嵌套使用,但是不能交叉使用3、标记不区分大小写属性的使用(属性控制内容的格式,额外的格式)1、书写位置在开始标记中2、格式:属性名=“属性值",多个属性之间使用空格分割3、不同的标记属性可能相同也可能不同4、属性使用的标记中,只能对本标中的内容记产生影响5、属性不冲突时,效果叠加,属性冲突时,就近原则html的基本结构〈html>-—--声明网页〈head〉———-网页的头部信息<title〉标题〈/title〉—---网页的标题</head><body〉—---网页的主体,网页内容主要展示的部分网页的主要内容</body>〈/html〉二. 文本格式的应用1、标题标记<hn>,n的取值1-6,1级标题最大效果:加粗显示,带有自动换行属性:align控制标题的对齐方式,取值left(左对齐,默认值)|center(居中)|right (右对齐)2、段落标记<p〉效果:把内容分段展示,自动换行属性:align,控制段落内容的对齐方式,取值left(左对齐,默认值)|center(居中)|right(右对齐)3、换行符〈br /〉,单标记,不需要结束标记,换行但不分段空格符号:&nbsp;表示一个空格强制换行符:<br /〉4、水平线标记<HR />,单标记效果:水平线,默认是一个粗细为2px(像素)的线条属性:size 控制水平线的粗细,取值为整数,单位为像素(px)width 控制水平线的长度,取值可以是像素单位,也可以是百分数(相对于浏览器窗口百分比)noshade设置水平线不带有阴影,该属性不需要取值color 设置水平线的颜色,取值可以是英文的颜色值,也可以是十六进制的颜色代码align 控制水平线的对齐方式,取值left(左对齐)|center(居中,默认值)|right(右对齐)5、分节标记<div〉效果:把内容设置为一节,前后带有自动换行属性:align控制div中内容的对齐方式,取值left(左对齐,默认值)|center(居中)|right(右对齐)6、居中标记符<center>效果:把center标记中的内容居中显示7、文本控制标记<font>效果:控制字体的各种显示样式属性:size 控制字体的大小,取值为绝对值时,1--7,数字越大字体越大,取相对值时,参考的是默认字体(3号),取值在-2-—+4之间color 控制字体的颜色face 控制字体的字体,取值可以是多个值,多个值之间使用逗号分割,取值时从左往右依次取值,找到合适的值为止,假如都不支持,使用默认格式显示8、字体的物理样式加粗:<b>斜体:〈i>下划线:〈u〉删除线:<s〉上标:<sup〉下标:〈sub>1、常用逻辑字符〈ADDRESS〉网页设计者或维护者的信息,通常显示为斜体<CITE> 表示文本属于引用,通常显示为斜体<CODE〉• 表示程序代码,通常显示为固定宽度字体<DFN> • 表示定义了的术语,通常显示为黑体或斜体〈EM> 强调某些字词,通常显示为斜体〈KBD〉表用户的键盘输入,通常显示为固定宽度字体〈SAMP> 表示文本样本,通常显示为固定宽度字体〈STRONG〉特别强调某些字词,通常显示为粗体<VAR> 表示变量,通常显示为斜体2、列表标记1、有序列表,〈ol〉,需要配合〈li>标记使用一个<li>标记对应一个选项ol的属性:type 控制列表的符号样式,取值1|A|a|i|I,默认是1start 控制列表的起始值,取值为任意的整数li的属性:type控制选项自身的符号样式,取值1|A|a|i|Ivalue控制选项本身的起始值,取值为任意整数,但是修改自身起始值之后,会对同一个列表中本选项之后的同级<li〉标记产生影响2、无序列表,<ul>,配合<li>标记使用一个<li>标记对应一个选项ul的属性:type 控制所有选项的符号样式,取值disc(实心圆,默认值)|circle(空心圆)|square(方块)li的属性:type控制选项本身的符号样式li标记用在ol中,type属性的取值跟ol的type属性取值走,用在ul中,跟着ul的type属性取值走3、定义列表,<dl〉,完成对定义列表的声明<dt>,术语标记,可以理解为类似于列表选项的标题使用〈dd>,描述标记,可以理解为类似于列表的选项使用三. 在网页中使用图片标记:〈img>,单标记,不需要结束标记属性: src 引入图片资源的路径绝对路径:资源在服务器上的位置,该位置是从盘符出发相对路径:资源在服务器上的相对位置,从网页本身出发.。

HTML基本语法

HTML基本语法

什么是 HTML?HTML 是用来描述网页的一种语言。

    HTML 指的是超文本标记语言 (Hyper Text Markup Language) HTML 不是一种编程语言,而是一种标记语言 (markup language) 标记语言是一套标记标签 (markup tag) HTML 使用标记标签来描述网页HTML 标签HTML 标记标签通常被称为 HTML 标签 (HTML tag)。

    HTML 标签是由尖括号包围的关键词,比如 <html> HTML 标签通常是成对出现的,比如 <b> 和 </b> 标签对中的第一个标签是开始标签,第二个标签是结束标签 开始和结束标签也被称为开放标签和闭合标签HTML 文档 = 网页   HTML 文档描述网页 HTML 文档包含 HTML 标签和纯文本 HTML 文档也被称为网页HTML 标题HTML 标题(Heading)是通过 <h1> - <h6> 等标签进行定义的。

注:1最大HTML 段落paragraphHTML 段落是通过 <p> 标签进行定义的。

HTML 链接HTML 链接是通过 <a> 标签进行定义的。

HTML 图像HTML 图像是通过 <img> 标签进行定义的。

HTML 文档是由 HTML 元素定义的。

HTML 元素HTML 元素指的是从开始标签(start tag)到结束标签(end tag)的所有代码。

开始标签 <p> <a href="default.htm" > <br /> <br> 就是没有关闭标签的空元素(<br> 标签定义换行) 。

在开始标签中添加斜杠,比如 <br />,是关闭空元素的正确方法,HTML、XHTML 和 XML 都接受这 种方式。

html基本语句

html基本语句

创建网页结构和内容的HTML基本语句HTML (Hypertext Markup Language) 是一种用于创建网页结构和内容的标记语言。

下面是一些基本的HTML语句:1.<!DOCTYPE html>: 声明文档类型为HTML5。

2.<html> </html>: 定义HTML文档的根元素。

3.<head> </head>: 定义文档的头部,其中包含了与文档相关的信息,如标题、样式表和脚本等。

4.<title> </title>: 定义文档的标题,显示在浏览器的标题栏或标签页上。

5.<body> </body>: 定义文档的主体部分,包含了要显示在浏览器窗口中的内容。

6.<h1> </h1> 到 <h6> </h6>: 定义标题,从最大的标题h1到最小的标题h6。

7.<p> </p>: 定义段落。

8.<a href="url"> </a>: 创建一个超链接,其中 "url"是目标链接的地址。

9.<img src="image.jpg" alt="描述">: 插入图像,其中 "image.jpg" 是图像的文件路径或URL,"描述" 是图像的替代文本。

10.<ul> </ul>: 定义无序列表。

11.<ol> </ol>: 定义有序列表。

12.<li> </li>: 定义列表项。

13.<table> </table>: 定义表格。

14.<tr> </tr>: 定义表格的行。

第3章 HTML语言基础

第3章  HTML语言基础

在起始标记和结尾标记中间的部分是元素体。 每一个元素都有名称和可选择的属性,元素 的名称和属性都在起始标记内标明。比如体
<body backgroud="background.gif"> <h2>示例</h2> 这是一个示例<p>
</body>
第一行是体元素的起始标记,它标明体 元素从此开始。由于所有的标记都具有相同 的结构,因此仔细分析这个标记的各个部分, 就能对标记的写法有一个大概了解。 < 起始标记开始
第3章 HTML语言基础
本章要点: 网页设计的基本原则 HTML语言及其基本语法
HTML(Hyper Text Markup Language, 即超文本标记语言)是一种用来制作超文 本文档的简单标记语言。用HTML编写的 超文本文档称为HTML文档,它能独立于 各种操作系统平台(如UNIX,WINDOWS 等)。自1990年以来HTML就一直被用作 WWW上的信息表述语言,用于描述网页 的格式设计和它与WWW上其它网页的链 接信息。
(5)定期更新网页内容。每隔一定时间就 对网页内容和版面设计进行较大幅度的更新, 从而吸引访问者的注意力。这不失为增加来 访次数的好方法。 (6)注意网站内容的搭配。在首页中尽量 使之美观大方,直观又丰富。其它网页要与 首页有很好的搭配效果。
(7)考虑不支持某些功能的浏览器。随着 网页设计技术的不断进步,在网页中经常会 使用一些特殊的技术,使得网页的功能更加 丰富,看起来也更加美观。但是不可排除一 些用户使用过时的浏览器浏览这些网页,这 就需要为这些特殊的功能部分添加替代性文 字,避免误将程序代码显示出来。 (8)对多媒体文件实施有限的限制。尽管 网络多媒体技术有了很大的发展,但由于网 络速度的限制,就要求一个网页设计者在设 计网页时要充分考虑到所添加多媒体部分的 大小和必要性。

HTML语法大全

HTML语法大全

HTML语法⼤全卷标 , 属性名称 , 简介<! - - ... - -> 批注<!> 跑马灯<marquee>...</marquee>普通卷动<marquee behavior=slide>...</marquee>滑动<marquee behavior=scroll>...</marquee>预设卷动<marquee behavior=alternate>...</marquee>来回卷动<marquee direction=down>...</marquee>向下卷动<marquee direction=up>...</marquee>向上卷动<marquee direction=right></marquee>向右卷动<marquee direction=left></marquee>向左卷动<marquee loop=2>...</marquee>卷动次数<marquee width=180>...</marquee>设定宽度<marquee height=30>...</marquee>设定⾼度<marquee bgcolor=FF0000>...</marquee>设定背景颜⾊<marquee scrollamount=30>...</marquee>设定卷动距离<marquee scrolldelay=300>...</marquee>设定卷动时间<!>字体效果<h1>...</h1>标题字(最⼤)<h6>...</h6>标题字(最⼩)<b>...</b>粗体字<strong>...</strong>粗体字(强调)<i>...</i>斜体字<em>...</em>斜体字(强调)<dfn>...</dfn>斜体字(表⽰定义)<u>...</u>底线<ins>...</ins>底线(表⽰插⼊⽂字)<strike>...</strike>横线<s>...</s>删除线<del>...</del>删除线(表⽰删除)<kbd>...</kbd>键盘⽂字<tt>...</tt> 打字体<xmp>...</xmp>固定宽度字体(在⽂件中空⽩、换⾏、定位功能有效)<plaintext>...</plaintext>固定宽度字体(不执⾏标记符号)<listing>...</listing> 固定宽度⼩字体...字体颜⾊...最⼩字体<font style =font-size:100 px>...⽆限增⼤<!>区断标记<hr>⽔平线<hr size=9>⽔平线(设定⼤⼩)<hr width=80%>⽔平线(设定宽度)<hr color=ff0000>⽔平线(设定颜⾊)<br>(换⾏)<nobr>...</nobr>⽔域(不换⾏)<p>...</p>⽔域(段落)<center>...</center>置中<!>连结格式<base href=地址>(预设好连结路径)<a href=地址>外部连结<a href=地址 target=_blank>外部连结(另开新窗⼝)<a href=地址 target=_top>外部连结(全窗⼝连结)<a href=地址 target=页框名>外部连结(在指定页框连结)<!>贴图/⾳乐<img src=图⽚地址>贴图<img src=图⽚地址 width=180>设定图⽚宽度<img src=图⽚地址 height=30>设定图⽚⾼度<img src=图⽚地址 alt=提⽰⽂字>设定图⽚提⽰⽂字<img src=图⽚地址 border=1>设定图⽚边框<bgsound src=MID⾳乐⽂件地址>背景⾳乐设定<!>表格语法<table aling=left>...</table>表格位置,置左<table aling=center>...</table>表格位置,置中<table background=图⽚路径>...</table>背景图⽚的URL=就是路径⽹址<table border=边框⼤⼩>...</table>设定表格边框⼤⼩(使⽤数字)<table bgcolor=颜⾊码>...</table>设定表格的背景颜⾊<table borderclor=颜⾊码>...</table>设定表格边框的颜⾊<table borderclordark=颜⾊码>...</table>设定表格暗边框的颜⾊<table borderclorlight=颜⾊码>...</table>设定表格亮边框的颜⾊<table cellpadding=参数>...</table>指定内容与⽹格线之间的间距(使⽤数字)<table cellspacing=参数>...</table>指定⽹格线与⽹格线之间的距离(使⽤数字)<table cols=参数>...</table>指定表格的栏数<table frame=参数>...</table>设定表格外框线的显⽰⽅式<table width=宽度>...</table>指定表格的宽度⼤⼩(使⽤数字)<table height=⾼度>...</table>指定表格的⾼度⼤⼩(使⽤数字)<td colspan=参数>...</td>指定储存格合并栏的栏数(使⽤数字)<td rowspan=参数>...</td>指定储存格合并列的列数(使⽤数字)<!>分割窗⼝<frameset cols="20%,*">左右分割,将左边框架分割⼤⼩为20%右边框架的⼤⼩浏览器会⾃动调整<frameset rows="20%,*">上下分割,将上⾯框架分割⼤⼩为20%下⾯框架的⼤⼩浏览器会⾃动调整<frameset cols="20%,*">分割左右两个框架<frameset cols="20%,*,20%">分割左中右三个框架<分割上下两个框架<frameset rows="20%,*,20%">分割上中下三个框架<! - - ... - -> 批注<A HREF TARGET> 指定超级链接的分割窗⼝<A HREF=#锚的名称> 指定锚名称的超级链接<A HREF> 指定超级链接<A NAME=锚的名称> 被连结点的名称<ADDRESS>....</ADDRESS> ⽤来显⽰电⼦邮箱地址<B> 粗体字<BASE TARGET> 指定超级链接的分割窗⼝<BASEFONT SIZE> 更改预设字形⼤⼩<BGSOUND SRC> 加⼊背景⾳乐<BIG> 显⽰⼤字体<BLINK> 闪烁的⽂字<BODY TEXT LINK VLINK> 设定⽂字颜⾊<BODY> 显⽰本⽂<BR> 换⾏<CAPTION ALIGN> 设定表格标题位置<CAPTION>...</CAPTION> 为表格加上标题<CENTER> 向中对齐<CITE>...<CITE> ⽤于引经据典的⽂字<CODE>...</CODE> ⽤于列出⼀段程序代码<COMMENT>...</COMMENT> 加上批注<DD> 设定定义列表的项⽬解说<DFN>...</DFN> 显⽰"定义"⽂字<DIR>...</DIR> 列表⽂字卷标<DL>...</DL> 设定定义列表的卷标<DT> 设定定义列表的项⽬<EM> 强调之⽤<FONT FACE> 任意指定所⽤的字形<FONT SIZE> 设定字体⼤⼩<FORM ACTION> 设定户动式窗体的处理⽅式<FORM METHOD> 设定户动式窗体之资料传送⽅式<FRAME MARGINHEIGHT> 设定窗⼝的上下边界<FRAME MARGINWIDTH> 设定窗⼝的左右边界<FRAME NAME> 为分割窗⼝命名<FRAME NORESIZE> 锁住分割窗⼝的⼤⼩<FRAME SCROLLING> 设定分割窗⼝的滚动条<FRAME SRC> 将HTML⽂件加⼊窗⼝<FRAMESET COLS> 将窗⼝分割成左右的⼦窗⼝<FRAMESET ROWS> 将窗⼝分割成上下的⼦窗⼝<FRAMESET>...</FRAMESET> 划分分割窗⼝<H1>~<H6> 设定⽂字⼤⼩<HEAD> 标⽰⽂件信息<HR> 加上分⽹格线<HTML> ⽂件的开始与结束<I> 斜体字<IMG ALIGN> 调整图形影像的位置<IMG ALT> 为你的图形影像加注<IMG DYNSRC LOOP> 加⼊影⽚<IMG HEIGHT WIDTH> 插⼊图⽚并预设图形⼤⼩第⼀章:HTML 语⾔的结构 html⽂件是标准的ASCII⽂件,它看起来象是加⼊了许多被称为链接签(tag)的特殊字符串的普遍⽂本⽂件。

html网页编辑代码简单介绍

html网页编辑代码简单介绍

版权号 © &copy;
注册商标 ® &reg;
“ &quot;
<li></li>
...
</ul>
注:<li>...</li>表示一个项目或标题
参数值 描述
 html语法
一、html最基本的语法就是<标记符>内容</标记符>,标记符通常都是成对使用
的,有一个开头标记和一个结束标记,结束标记只是在开头标记的前面加一个斜
杠“/”。例如:<font size="7">文字内容</font> <hr width="80%"/>
二、html语法的最好学习方法就是查看网页的源代码。
2、格式:<p align="对齐方式">...</p>
3、属性名称 属性值 说明
left 左对齐
align center 居中
2、body属性
<body bgcolor="背景颜色" background="背景图像" text="文本颜色" link="链接文本颜色" vlink="访问过的文本颜色" alink="激活的链接文本颜色" left margin="左边界" right margin="右边界" top margin="上边界" bottom margin="下边界"
下标 <sub>文本</sub>

HTML文档的基本语法结构

HTML文档的基本语法结构

HTML文档的基本结构<HTML> HTML文件开始<HEAD> HTML文件的头部开始…… HTML文件的头部内容</HEAD> HTML文件的头部结束<BODY> HTML文件的主体开始…… HTML文件的主体内容</BODY> HTML文件的主体结束</HTML> HTML文件结束编写文档的注意事项:“<”和“>”是任何标记的开始和结束;标记与标记之间可以嵌套;如:<H2><CENTER>I LOVE CHINA!</CENTER></H>在源代码中不区分大小写;任何回车和空格在源代码中不起作用。

HTML标记中可以放置各种属性;可增加注释,以“<!--”开始,以“-->”结束,注释只出现在源代码中,不会在浏览器中显示。

HTML 标记的格式: <标记名属性= “值”>标题标记<title>⏹基本语法: <TITLE>……</TITLE>段落标记<p>⏹基本语法: <P>……</P>段落标记的对齐属性A L I G N⏹ALIGN属性可以使段落文字进行居左left、居中center、居右right的对齐。

换行标记<br>标题字标记<Hn> :(n=1~6)⏹基本语法: <Hn>……</Hn>标题字的对齐属性ALIGN<BODY>标记⏹<body>标记中放置要在浏览器中所显示信息的所有标志和属性⏹<body>的属性:☐Bgcolor:背景色☐Background:背景图片☐T ext:文字颜色☐Link:超链接颜色☐Vlink:访问后超链接颜色☐Alink:鼠标按下链接文字时的链接颜色插入水平线标记<hr>⏹<HR>标记的属性:☐Width:水平条的宽度。

HTML语言语法大全

HTML语言语法大全

HTML语⾔语法⼤全<! - - ... - -> 註解<!> 跑⾺燈<marquee>...</marquee>普通捲動<marquee behavior=slide>...</marquee>滑動<marquee behavior=scroll>...</marquee>預設捲動<marquee behavior=alternate>...</marquee>來回捲動<marquee direction=down>...</marquee>向下捲動<marquee direction=up>...</marquee>向上捲動<marquee direction=right></marquee>向右捲動<marquee direction=’left’></marquee>向左捲動<marquee loop=2>...</marquee>捲動次數<marquee width=180>...</marquee>設定寬度<marquee height=30>...</marquee>設定⾼度<marquee bgcolor=FF0000>...</marquee>設定背景顏⾊<marquee scrollamount=30>...</marquee>設定滚动速度<marquee scrolldelay=300>...</marquee>設定捲動時間<marquee onmouseover="this.stop()">...</marquee>⿏标经过上⾯时停⽌滚动<marquee onmouseover="this.start()">...</marquee>⿏标离开时开始滚动<!>字體效果<h1>...</h1>標題字(最⼤)<h6>...</h6>標題字(最⼩)<b>...</b>粗體字<strong>...</strong>粗體字(強調) (同上效果略同)<i>...</i>斜體字<em>...</em>斜體字(強調)<dfn>...</dfn>斜體字(表⽰定義)<u>...</u>底線<ins>...</ins>底線(表⽰插⼊⽂字)<strike>...</strike>橫線<s>...</s>刪除線<del>...</del>刪除線(表⽰刪除)<kbd>...</kbd>鍵盤⽂字<tt>...</tt> 打字體<xmp>...</xmp>固定寬度字體(在⽂件中空⽩、換⾏、定位功能有效)<plaintext>...</plaintext>固定寬度字體(不執⾏標記符號)<listing>...</listing> 固定寬度⼩字體<font color=00ff00>...</font>字體顏⾊<font size=1>...</font>最⼩字體<font style =’font-size:100 px’>...</font>無限增⼤<!>區斷標記<hr>⽔平線<hr size=’9’>⽔平線(設定⼤⼩)<hr width=’80%’>⽔平線(設定寬度)<hr color=’ff0000’>⽔平線(設定顏⾊)<br>(換⾏)<nobr>...</nobr>⽔域(不換⾏)<p>...</p>⽔域(段落)<center>...</center>置中<!>連結格式<base href=位址>(預設好連結路徑)<a href=位址></a>外部連結<a href=位址 target=’_blank’></a>外部連結(另開新視窗)<a href=位址 target=’_top’></a>外部連結(全視窗連結)<a href=位址 target=’⾴框名’></a>外部連結(在指定⾴框連結)<!>貼圖/⾳樂<img src=圖⽚位址>貼圖<img src=圖⽚位址 width=’180’>設定圖⽚寬度<img src=圖⽚位址 height=’30’>設定圖⽚⾼度<img src=圖⽚位址 alt=’提⽰⽂字’>設定圖⽚提⽰⽂字<img src=圖⽚位址’ border=’1’>設定圖⽚邊框<bgsound src=MID⾳樂檔位址>背景⾳樂設定<!>表格語法<table aling=left>...</table>表格位置,置左<table aling=center>...</table>表格位置,置中<table background=圖⽚路徑>...</table>背景圖⽚的URL=就是路徑網址<table border=邊框⼤⼩>...</table>設定表格邊框⼤⼩(使⽤數字)<table bgcolor=顏⾊碼>...</table>設定表格的背景顏⾊<table borderclor=顏⾊碼>...</table>設定表格邊框的顏⾊<table borderclordark=顏⾊碼>...</table>設定表格暗邊框的顏⾊<table borderclorlight=顏⾊碼>...</table>設定表格亮邊框的顏⾊<table cellpadding=參數>...</table>指定內容與格線之間的間距(使⽤數字)<table cellspacing=參數>...</table>指定格線與格線之間的距離(使⽤數字)<table cols=參數>...</table>指定表格的欄數<table frame=參數>...</table>設定表格外框線的顯⽰⽅式<table width=寬度>...</table>指定表格的寬度⼤⼩(使⽤數字)<table height=⾼度>...</table>指定表格的⾼度⼤⼩(使⽤數字)<td colspan=參數>...</td>指定儲存格合併欄的欄數(使⽤數字)<td rowspan=參數>...</td>指定儲存格合併列的列數(使⽤數字)<!>分割視窗<frameset cols="20%,*">左右分割,將左邊框架分割⼤⼩為20%右邊框架的⼤⼩瀏覽器會⾃動調整<frameset rows="20%,*">上下分割,將上⾯框架分割⼤⼩為20%下⾯框架的⼤⼩瀏覽器會⾃動調整<frameset cols="20%,*">分割左右兩個框架<frameset cols="20%,*,20%">分割左中右三個框架<分割上下兩個框架<frameset rows="20%,*,20%">分割上中下三個框架<! - - ... - -> 註解<A HREF TARGET> 指定超連結的分割視窗<A HREF=#錨的名稱> 指定錨名稱的超連結<A HREF> 指定超連結<A NAME=錨的名稱> 被連結點的名稱<ADDRESS>....</ADDRESS> ⽤來顯⽰電⼦郵箱地址<B> 粗體字<BASE TARGET> 指定超連結的分割視窗<BASEFONT SIZE> 更改預設字形⼤⼩<BGSOUND SRC> 加⼊背景⾳樂<BIG> 顯⽰⼤字體<BLINK> 閃爍的⽂字<BODY TEXT LINK VLINK> 設定⽂字顏⾊<BODY> 顯⽰本⽂<BR> 換⾏<CAPTION ALIGN> 設定表格標題位置<CAPTION>...</CAPTION> 為表格加上標題<CENTER> 向中對⿑<CITE>...<CITE> ⽤於引經據典的⽂字<CODE>...</CODE> ⽤於列出⼀段程式碼<COMMENT>...</COMMENT> 加上註解<DD> 設定定義列表的項⽬解說<DFN>...</DFN> 顯⽰"定義"⽂字<DIR>...</DIR> 列表⽂字標籤<DL>...</DL> 設定定義列表的標籤<DT> 設定定義列表的項⽬<EM> 強調之⽤<FONT FACE> 任意指定所⽤的字形<FONT SIZE> 設定字體⼤⼩<FORM ACTION> 設定⼾動式表單的處理⽅式<FORM METHOD> 設定⼾動式表單之資料傳送⽅式<FRame MARGINHEIGHT> 設定視窗的上下邊界<FRame MARGINWIDTH> 設定視窗的左右邊界<FRame NAME> 為分割視窗命名<FRame NORESIZE> 鎖住分割視窗的⼤⼩<FRame SCROLLING> 設定分割視窗的捲軸<FRame SRC> 將HTML檔加⼊視窗<FRameSET COLS> 將視窗分割成左右的⼦視窗<FRameSET ROWS> 將視窗分割成上下的⼦視窗<FRameSET>...</FRameSET> 劃分分割視窗<H1>~<H6> 設定⽂字⼤⼩<HEAD> 標⽰⽂件資訊<HR> 加上分格線<HTML> ⽂件的開始與結束<I> 斜體字<IMG ALIGN> 調整圖形影像的位置<IMG ALT> 為你的圖形影像加註<IMG DYNSRC LOOP> 加⼊影⽚<IMG HEIGHT WIDTH> 插⼊圖⽚並預設圖形⼤⼩<IMG HSPACE> 插⼊圖⽚並預設圖形的左右邊界<IMG LOWSRC> 預載圖⽚功能<IMG SRC BORDER> 設定圖⽚邊界<IMG SRC> 插⼊圖⽚<IMG VSPACE> 插⼊圖⽚並預設圖形的上下邊界<INPUT TYPE NAME value> 在表單中加⼊輸⼊欄位<ISINDEX> 定義查詢⽤表單<KBD>...</KBD> 表⽰使⽤者輸⼊⽂字<LI TYPE>...</LI> 列表的項⽬ ( 可指定符號 )<MARQUEE> 跑⾺燈效果<MENU>...</MENU> 條列⽂字標籤<meta NAME="REFRESH" CONTENT URL> ⾃動更新⽂件內容<MULTIPLE> 可同時選擇多項的列表欄<NOFRame> 定義不出現分割視窗的⽂字<OL>...</OL> 有序號的列表<OPTION> 定義表單中列表欄的項⽬<P ALIGN> 設定對⿑⽅向<P> 分段<PERSON>...</PERSON> 顯⽰⼈名<PRE> 使⽤原有排列<SAMP>...</SAMP> ⽤於引⽤字<select >...</select > 在表單中定義列表欄<SMALL> 顯⽰⼩字體<STRIKE> ⽂字加橫線<STRONG> ⽤於加強語氣<SUB> 下標字<SUP> 上標字<TABLE BORDER=n> 調整表格的寬線⾼度<TABLE CELLPADDING> 調整資料欄位之邊界<TABLE CELLSPACING> 調整表格線的寬度<TABLE HEIGHT> 調整表格的⾼度<TABLE WIDTH> 調整表格的寬度<TABLE>...</TABLE> 產⽣表格的標籤<TD ALIGN> 調整表格欄位之左右對⿑<TD BGCOLOR> 設定表格欄位之背景顏⾊<TD COLSPAN ROWSPAN> 表格欄位的合併<TD NOWRAP> 設定表格欄位不換⾏<TD VALIGN> 調整表格欄位之上下對⿑<TD WIDTH> 調整表格欄位寬度<TD>...</TD> 定義表格的資料欄位<TEXTAREA NAME ROWS COLS> 表單中加⼊多少列的⽂字輸⼊欄<TEXTAREA WRAP> 決定⽂字輸⼊欄是⾃動否換⾏<TH>...</TH> 定義表格的標頭欄位<TITLE> ⽂件標題<TR>...</TR> 定義表格美⼀⾏<TT> 打字機字體<U> ⽂字加底線<UL TYPE>...</UL> 無序號的列表 ( 可指定符號 )<var>...</var> ⽤於顯⽰變數BlockQuotc⽂本缩进表⽰颜⾊的有三种⽅式;1,16进制颜⾊代码语法:#RRGGBB例:<font color="#ff0000">红⾊</font>2,10进制RGB码语法:RGB(RRR,GGG,BBB)例:<font color="rgb(255,000,000)">红⾊</font>3,直接⽤颜⾊的英⽂名称例:<font color="red">红⾊</font><body>.....</body>属性可分为三种:1,背景属性包括:bgcolor,background2,⽂字属性:包括:text,link,alink,vlink,3,留⽩属性:其中分为:leftmargin,topmargin.bgcolor背景⾊语法格式:<body bgcolor="#ff0000">.background背景图案。

超文本标记语言(html)的基础知识

超文本标记语言(html)的基础知识

超文本标记语言(html)的基础知识超文本标记语言,即HTML(HyperText Markup Language),是一种用于创建网页和其他可在web浏览器中查看的信息的标准标记语言。

在这里,我们将初步介绍HTML的基础知识,包括HTML的定义、语法和一些常用的标签。

一、HTML的定义HTML是一种标记语言,它使用标记来创建网页的各个部分。

在HTML文档中,标记用于指示文本的结构和格式。

HTML文档包含视觉元素,例如标题、段落、列表、链接、图像和表格。

二、HTML的语法HTML文档由标签和内容组成。

标签告诉浏览器如何呈现文本。

标签通常成对出现,包围文本。

打开标记以开始效果,关闭标记以结束效果。

标签通常按照以下格式编写:<标记>内容</标记>三、HTML的常用标签1. 标题标签:用于定义HTML文档中的标题。

HTML中有六个级别的标题:<h1>到<h6>,其中<h1>是最大的标题。

2. 段落标签:用于定义HTML文档中的段落。

<p>标签用于标记段落的开始和结束。

3. 链接标签:用于在HTML文档中创建链接。

<a>标签可以将文本链接到其他网页、文件、电子邮件地址等。

4. 图像标签:用于将图像插入HTML文档。

<img>标签按以下格式编写:<img src="image.jpg" alt="图像" width="500" height="500">5. 列表标签:用于创建有序和无序列表。

<ul>标签用于创建无序列表,<ol>标签用于创建有序列表。

6. 表格标签:用于在HTML文档中创建表格。

<table>标签用于定义表格,<tr>标签定义表格行,<td>标签定义表格单元格。

HTML基本标签及语法

HTML基本标签及语法

HTML基本标签及语法HTML简介什么是HTML本⽂素材来源于⿊马程序员Pink⽼师HTML 指的是超⽂本标记语⾔(Hyper Text Markup Language) ,它是⽤来描述⽹页的⼀种语⾔。

HTML 不是⼀种编程语⾔,⽽是⼀种标记语⾔(markup language)。

标记语⾔是⼀套标记标签(markup tag)。

Web 标准的构成主要包括结构(Structure)、表现(Presentation)和⾏为(Behavior)三个⽅⾯。

结构 --> 结构⽤于对⽹页元素进⾏整理和分类,现阶段主要学的是HTML表现 --> 表现⽤于设置⽹页元素的版式、颜⾊、⼤⼩等外观样式,主要指的是CSS⾏为 --> ⾏为是指⽹页模型的定义及交互的编写,现阶段主要学的是JavascriptWeb 标准提出的最佳体验⽅案:结构、样式、⾏为相分离。

简单理解:结构写到HTML ⽂件中,表现写到CSS ⽂件中,⾏为写到JavaScript ⽂件中。

HTML基本语法HTML基本⾻架标签名定义说明<html><\html>HTML标签页⾯中最⼤的标签,所有内容都包含在该标签内<body><\body>⽂档头部设置⼀些属性,以及引进⽂件样式<title><\title>⽂档标题浏览器所显⽰的⽹页标题<body><\body>⽂档主题基本上⼀个⽹页的所有页⾯元素都放进该标签内⼀个基本的⽹页⾻架<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title></head><body><div>我的第⼀个⽹页</div></body></html>基本语法概述1. HTML 标签是由尖括号包围的关键词,例如<html>。

HTML基本语法汇总大全

HTML基本语法汇总大全

HTML基本语法汇总如果你是刚刚学习制作自己的网页,则本文对你可能有所帮助。

它列出了超文本标记语言HTML最基本的语法一、基本标记文件格式<html></html>(文件的开头与结尾)文头区段<head></head>(描述文件的信息)标题<title></title>(显示在IE的标题栏)基底网址<base href="URL" target="Frame_name"> 在IE中取得完整的文件或网址路径例:<base href="61.158.10.5/llzhi" target="Content">CSS样式表:例一、<style>body{background-attachment:fixed}</style>本例为固定背景图片例二、先在<head>区进行定义<style type="text/css"><!--.aa{font-size:100;color:redbackground-color:pink}.bb{font-size:50;color:#00ff00}--></style>在正文中用class=样式名,来调用<p class="aa">字体和颜色的变化</p>正文区段<body></body>(放此文件的内容)文字颜色<body text=?> (RGB色码)打开窗口提示信息:<body onload=alert('info1')点击关闭窗口<a href="javascript:window.close()">点击关闭窗口</a> 关闭窗口提示信息:<body onunload=alert('info2')>标题<h?></h>(?=1~6,改变标题字的大小)标题对齐<h align=right,left,center></h>字加大<big></big>字变小<small></small>粗体字<b></b>斜体字<i></i>底线字<u></u>上标字<sup></sup>下标字<sub></sub>文字对中<center></center>基本字体大小<basefont size>(取值范围从1到7,默认值为3)改变字体大小<font size=?></font>(?=1~7)字体颜色<font color=#rrggbb></font>(RGB色码)指定字型<font face=?></font>(?=宋体,楷体等)二、超链结网址链结<a href="URL"></a>设定锚点<a name="?"></a>(?以容易记为原则)链结到锚点<a href="#?"></a>(同一份文件)<a href="URL#?"></A>(锚点不同文件)显示图形<img src="URL"></a>图形位置<img src="URL" align=top,bottom,middle,left,right>(分别为上、下、中、左、右的位置)图形取代文字<img src="URL"alt=?>(无法显示图形时用)图形尺寸<img src="URL" width=? height=?>(?以像素为单位)连结图形边线<img src="URL"border=?>(?以像素为单位)图形四周留白<img src="URL"hspace=? vspace=?>(?以像素为单位)三、区段划分段落<p></p>(font标签自动分段)断行<br>关闭换行<nobr></nobr>保留段落格式<pre></pre>区块<div></div>不能含有P标签横线<hr>横线厚度<hr size=?>(?以像素为单位)横线长度<hr width=?>(?以像素为单位)横线长度<hr width=?%>(?与页宽相比较)实横线<hr noshade>(无立体效果)实线颜色<hr color=?>(RGB色码)四、背景图案颜色及音乐背景图案<body background="image_file" bgproperties=fixed>图形文件格式为gif和jpg,后面的背景颜色<body bgcolor=#rrggbb>(RGB色码) fixed为浮水印效果背景文字颜色<body text=#rrggbb>(RGB色码)未链结点颜色<body link=#rrggbb>(RGB色码)已链结点颜色<body vlink=#rrggbb>(RGB色码)正在链结点颜色<body alink=#rrggbb(RGB色码)背景音乐<bgsound src="music_file" Loop=?/-1>加在<head>或<body>中均可,?为次数,-1为循环例:<bgsound src="star.mid" Loop=-1> 支持.mid及.wav等格式五、表格的使用基本组成:<table border=? height=? width=? bgcolor=?>border=?框线宽度,单位为点数,0为不显示框线。

前端技术开发考试必备知识点

前端技术开发考试必备知识点

前端技术开发考试必备知识点一、HTML(超文本标记语言)1. 基本结构。

- `<!DOCTYPE html>`:声明文档类型为HTML5。

- `<html>`标签:整个HTML文档的根标签,包含`<head>`和`<body>`。

- `<head>`:包含文档的元数据,如`<title>`(设置网页标题)、`<meta>`(用于描述网页的各种信息,如字符编码`<meta charset = "UTF - 8">`)等。

- `<body>`:包含网页的可见内容,如文本、图像、链接等。

2. 标签类型。

- 块级标签:如`<div>`(用于划分页面区域)、`<p>`(段落)等,默认占据一行,可设置宽度、高度等属性。

- 行内标签:如`<span>`(用于包裹行内元素)、`<a>`(链接)等,在一行内显示,宽度由内容撑开。

3. 常用标签。

- `<img>`:用于插入图像,属性有`src`(图像的源地址)、`alt`(图像的替代文本,当图像无法显示时显示)。

- `<input>`:用于创建表单输入元素,类型有`text`(文本输入)、`password`(密码输入)、`radio`(单选按钮)、`checkbox`(复选框)等。

- `<select>`和`<option>`:用于创建下拉菜单,`<select>`是容器,`<option>`是菜单中的选项。

二、CSS(层叠样式表)1. 引入方式。

- 内联样式:在HTML标签内使用`style`属性,如`<div style = "color: red; font - size: 16px;">`。

HTML语法

HTML语法

2.1 HTML简介2.1.1 什么是HTML?HTML(Hyper Text Markup Language,超文本标记语言)是一种用于网页制作的排版语言,是Web最基本的构成元素。

2.1.2 HTML的主要功能1.格式化文本。

如设置标题、字体、字号、颜色;设置文本的段落、对齐方式等。

2.建立超链接。

只需用鼠标单击,就可达任何一处。

3.创建列表。

把信息用一种易读的方式表现出来。

4.插入图像。

使网页图文并茂,还可设置图像的各种属性,如大小、边框、布局等。

5.建立表格。

表格为浏览者提供快速找到需要信息的显示方式,还可以用表格来设定整个网页的布局。

6.加入多媒体。

可在网页中加入音频、视频、动画,还能设定播放的时间和次数。

7.交互式表单、计数器等。

2.1.3 HTML基本结构一个HTML文件可由下列3部分组成:1.标记1)单一标记:只要一个标记就能完成所要表示的功能,如<hr>可以显示一条水平的分隔线。

2)成对标记:需要两个标记组合才能完成所需功能,如<title>及</title>、<html>及<html>。

2.文字与图形资料文字与图形是指提供给浏览信息的人阅读的内容,而WWW显示的图形都是以个别的文件存在的。

若要显示图形,必须使用特殊的标记指向图形文件。

3.统一的资源定位器URLURL是WWW上文件的参照格式,浏览者在浏览器的地址处输入URL格式的内容,就可取得所指的主机的主页。

2.1.4 HTML的编辑环境任何文本编辑器都可用来制作网页,包括记事本、写字板、Word、WPS等编辑程序。

不过在保存时,一定要用纯文本方式存盘。

若要看到用户自己设计的网页效果,就需要安装一个浏览器,如Internet Explorer,Netscape Navigator 等2.2 HTML文件结构的格式2.2.1 HTML的基本语法1.了解HTML的标记HTML文件是由标记和文本组成格式为:〈标记〉受标记影响的文本〈/标记〉标记的属性。

html基本语法

html基本语法

html基本语法⼀、什么是HTML?HTML不是编程语⾔,是⽤来描述⽹页⽂档(页⾯结构)的⼀种标记语⾔;HTML指超⽂本标记语⾔(Hyper Text Markup Language),之所以称为超⽂本标记语⾔,是因为⽂本中包含了所谓“超级链接”点。

;HTML规定了⾃⼰的语法规则,⽤来表⽰⽐“⽂本”更丰富的意义,⽐如图⽚,表格,链接等。

浏览器(IE,FireFox等)软件知道HTML语⾔的语法,可以⽤来查看HTML⽂档。

⽬前互联⽹上的绝⼤部分⽹页都是使⽤HTML编写的。

⼆、HTML是什么样的?简单地来说,HTML的语法就是给⽂本加上表明⽂本含义的标签(Tag),让⽤户(⼈或程序)能对⽂本得到更好的理解。

下⾯是⼀个最简单的HTML⽂档:<html><head><title>第⼀个Html⽂档</title></head><body>欢迎访问<a href="/">我的博客</a>!</body></html>所有的HTML⽂档都应该有⼀个<html>元素,<html>元素可以包含两个部分:<head>和<body>。

<head>元素⽤于包含整个⽂档的⼀般信息,⽐如⽂档的标题(<title>元素⽤于包含标题),对整个⽂档的描述,⽂档的关键字等等。

⽂档的具体内容就要放在<body>元素⾥。

<a>元素⽤于表⽰链接,在浏览器(如IE,Firefox等)中查看HTML⽂档时,点击<a>标签括起来的内容时,通常会跳转到另⼀个页⾯。

这个要跳转到的页⾯的地址由<a>元素的href属性指定。

上⾯的<ahref=/>中,href属性的值就是/。

三、HTML⽂档可以包含哪些内容?通过不同的标签,HTML⽂档可以包含不同的内容,⽐如⽂本,链接,图⽚,列表,表格,表单,框架等。

Html语法大全

Html语法大全

Html语法大全访问过的可连接文字的颜色语法格式:<body text="color" link="color" alink="color" vlink="color"> .leftmargin 页面左侧的留白距离.topmargin 页面顶部的留白距离语法格式:<body leftmargin="value" topmargin="value">注:value为长度值为数字align 属性语法:<h2 align="">文字</h2>其属性有三种:left靠左,center居中,right靠右〈p〉</p>为段落标记,可利用以上属性对整个段落进行设置〈br>为换行标记<nobr></nobr>为不换行标记放在文字两边即可例:<body><h3>江南逢李龟年</h3><p>歧王宅里寻常见<br>催九堂前几度闻<br>正是江南好风景<br>落花时节又逢君</p></body><pre>......</pre> 浏览是效果和编写是效果格式一样列表分为1无序列表又称符号列表语法格式:<ul type="">type的属性可选直disc实心圆点,clrcle空心圆点,square实心方框<li>文字</li><li>文字</li></ul>2有序列表语法格式:<ol type="" start""><li>文字</li><li>文字</li></ol>type的值是编号字符可选的有1...,a...,A...,i... ,I...start为起始值例:如果start为3是那么将从3开始,而且必须是数字。

html编程的基本格式

html编程的基本格式

html编程的基本格式
1、<!DOCTYPE>
<!DOCTYPE>位于文档的最前面,用于向浏览器说明当前文档使用那种HTML或XHTML标准规范。

只有在开头处使用<!DOCTYPE>声明,浏览文档作为有效的HTML文档,并按指定的文档类型进行解析。

2、<html>
<html>位于<!DOCTYPE>之后,也被称为跟标签。

跟标签主要用于告知浏览器其自身是一个HTML文旦,其中<HTML>标志着HTML文档的开始志着HTML文旦的结束,在它们之间是文档的头部和主体内容。

3、<head>
<head>用于定义HTML文档的头部信息,也被称为头部标签,紧跟在<html>之后。

头部标签主要用于封装其他位于文档头部的标签,例<meta>、<link>和<style>等,用来描述文档的标题、作者,以及与其他文档的关系。

4、<body>
<body>用于定义HTML文档所要显示的内容,也被成为主体标签。

浏览器中显示的所有文本、图像、音频和视频等信息都必须位于<body>内,示给用户。

HTML基础知识

HTML基础知识
<html> <head> <title>显示在浏览器窗口最顶端中的文本</title> </head> <body bgcolor="red" text="blue"> <p>红色背景、蓝色文本</p> </body>
</html>
注意:<title></title>标志对只能放在<head></head>标志对之间。
</html>
以上在 IE 中的运行效果如图 1-30 所示。
图 1-30 格式标记执行效果图
6.<div>……</div> <div></div>标志对用来排版大块 HTML 段落,也用于格式化表,此标志对的用法与<p></p>标志 对非常相似,同样有 align 对齐方式属性。
1.1.5 文本标记
HTML 基础知识
2017-11-18
Internet 风行世界,作为展现 Internet 风采的重要载体,Web 页受到了愈来愈多人的重视。好的Web 页可以吸引用户频频光顾站点,从而达到宣传网站的目的。Web 页是由 HTML(Hypertext Markup Language,超文本标记语言)组织起来的,由浏览器解释显示的一种文件。
4.<title>……</title>
使用过浏览器的人可能都会注意到浏览器窗口最上边蓝色部分显示的文本信息,那些信息一般是 网页的主题。要将网页的主题显示到浏览器的顶部其实很简单,只要在<title></title>标志对之间加入需 要显示的文本即可。

网页代码HTML语法大全

网页代码HTML语法大全

⽹页代码HTML语法⼤全■细说HTML标签在HTML语法中,⼤致上可以分为:⽹页架构:主要⽹页主架构的介绍分隔标签:也就是所谓的⽔平线排版标签:针对标签的属性,可做适当的版⾯编排字体标签:教导您设定⽂字的字体。

⽂字标签:教导您设定⽂字的颜⾊、⾏距、变化.....等等。

影像标签:教导您如何在⽹页中,植⼊图像。

背景标签:教导您如何设定背景颜⾊或是背景图像。

链接标签:教导您如何设定超链接,以及开视窗的条件。

表格标签:教导您如何在⽹页中运⽤表格。

序列标签:教导您如何设定⽂字序列或图形序列。

表单标签:教导您如何制作可填写⽤的表单。

框架标签:可让同⼀个视窗由多个⽹页⼀起组成。

其他技巧:让您的整个⽹页背景可以让您设定为图⽚或是声⾳。

4.1 ⽹页架构<HTML> <HEAD> <TITLE>⼯具啦⽹页制作教学</TITLE> <Meta> </HEAD> <BODY> BODY之间则为主要语法所在,也是⽹页的主要呈现部分。

 </BODY></HTML>【标签解说】以上看到的就是⼀篇最简单架构的⽹页。

没错,⽹页其实就是⼀堆标签(所谓标签就是指被<>包起来的语法)集合起来的,透过浏览器的消化整理,就便成了美仑美奂的⽹页了。

简单⽽⾔,通常⼀份完整的⽹页包含了⼆个部份:抬头(HEAD)、⽂件本体(BODY)。

也就是各位在上⾯所看到的<HEAD></HEAD>以及<BODY></BODY>。

在抬头的部份<HEAD></HEAD>中,有另⼀组标签<TITLE></TITLE>。

打在<TITLE></TITLE>这⾥⾯的⽂字会出现在浏览器视窗最上头蓝⾊部份⾥,当作⼀篇⽹页的主题。

您可能会发现,为什么我⼀直没提到<HTML></HTML>这⼀组标签,嗯!因为它可有可⽆。

  1. 1、下载文档前请自行甄别文档内容的完整性,平台不提供额外的编辑、内容补充、找答案等附加服务。
  2. 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
  3. 3、如文档侵犯您的权益,请联系客服反馈,我们会尽快为您处理(人工客服工作时间:9:00-18:30)。

Html的基本语法1.1 Html概况1.1.1 什么是HtmlHtml英语意思是:Hypertext Marked Language,即超文本标记语言,是一种用来制作超文本文档的简单标记语言。

是所有的internet站点的共同的语言,所有的页面都是以Html格式的文件为基础,再加上其他语言工具(例JavaScript、VBScript等)构成。

用HTML编写的超文本文档称为HTML文档,它能独立于各种操作系统平台。

Html文件扩展名是.html或.htm,它们是可供浏览器解释浏览的文件格式。

Html语言使用标签对的方法编写文件,它通常使用<标签名></标签名>来表示标签的开始和结束。

在Html文档中这样的标签对一般是成对使用的。

1.1.2 为什么要学习Html通过前面的学习我们知道,Micromedia公司的Dreamweaver是“所见即所得”的网页制作工具,使用它可以直接开发网页,而不用费劲的书写代码,这使得用户在没有Html语言基础的情况下,照样可以设计网页,而相应的Html文档由开发工具自动编写,这是网页图形编辑工具的最大优点,同时也是它最大的不足。

受到图形编辑工具自身的约束,将产生大量的垃圾代码。

所以,我们应该在掌握图形编辑工具的基础上进一步学会HTML语言,从而知道哪些是垃圾代码,消除无用的代码,制作出高质量的网页。

1.2 Html文档的结构超文本文档分文档头和文档体两部分,在文档头里,对这个文档进行了一些必要的定义,文档体中才是要显示的各种文档信息。

<HTML><HEAD>头部信息</HEAD><BODY>文档主体,正文部分</BODY></HTML>其中<HTML>在最外层,表示这对标记间的内容是HTML文档。

我们还会看到一些网页省略<HTML>标记,因为.html 或.htm 文件被Web浏览器默认为是HTML文档。

<HEAD>之间包括文档的头部信息,如文档总标题等,若不需要头部信息则可省略此标记。

<BODY> 标记一般不能省略,它表示正文内容的开始。

下面是一个最基本的超文本文档的源代码:<HTML><HEAD><TITLE>网页标题</TITLE> </HEAD><BODY><H3>欢迎光临我的主页</H3> <BR><HR>这是一个我的第一个网页</BODY></HTML>━┓┃文件头━┛━┓┃┃┃┃文件体┃┃━┛1.3 标签的格式1.3.1 标签的作用HTML标签是组成HTML文档元素,每一个标签描述了一个功能。

HTML标签两端有两个包括字符:“<”和“>”,这两个包括字符被称为角括号。

HTML标签一般成对出现,比如<table>和</table>。

无斜杠的标签的为开始标签,有斜杠的为结束标签,在开始和结束标签之间的对象是元素内容。

如<table>表示一个表格的开始,</table>表示一个表格的结束。

HTML标签是大小写无关的,但我们习惯用小写。

1.3.2 标签的分类:标签分为单标签,双标签两种。

单标签:只需单独使用就能完整地表达意思,这类标记的语法是:< 标签名称>最常用的单标签是<BR>, 它表示换行。

双标签:它由“始标签”和“尾标签”两部分构成,必须成对使用,其中始标签告诉Web浏览器从此处开始执行该标记所表示的功能,而尾标签告诉Web浏览器在这里结束该功能。

始标签前加一个斜杠(/)即成为尾标记。

这类标记的语法是:<标签> 内容</ 标签>其中“内容”部分就是要被这对标记施加作用的部分1.3.3 标签的属性:为了增强标签的功能,许多单标记和双标记的始标记内可以包含一些属性,其语法是:<标签名字属性1=“属性值1”属性2=“属性值2”属性3=“属性值3”… > 各属性之间无先后次序,属性值应该被包含在引号中,常用双引号,但是单引号也可以使用,在有些情况下,比如说属性值本身包含引号,就得使用单引号。

比如:name='John "ShotGun" Nelson'。

注意:中文引号跟英文引号是不一样的。

上面所指的引号都是英文状态下的引号,属性也可省略(即取默认值)。

1.4 基本标签1.4.1 <html></html> 用于创建Html文档<html>标签用于Html文档的最前边,用来标识Html文档的开始。

而</html>标签恰恰相反,它放在Html文档的最后边,用来标识Html文档的结束,这对标签必须成对使用。

1.4.2 <head></head><head>和</head>构成Html文档的头部分,在此标签对之间可以使用<title></title>、<script></script>等标签对,这些标签对都是描述Html文档头部信息的标签对,<head></head>标签对之间的内容是不会在浏览器的框内显示出来的。

这对标签必须成对使用。

1.4.3 网页标题<title></title>使用过浏览器的人可能都会注意到浏览器窗口最上边蓝色部分显示的文本信息,那些信息一般是网页的“主题”,要将您的网页的主题显示到浏览器的顶部其实很简单,只要在<title></title>标签对之间加入您要显示的文本即可。

注意:<title></title>标签对只能放在<head></head>标签对之间。

1.4.4 <body></body><body></body>是Html文档的主体部分,在此标签对之间可包含<p>、</p>、<h1>、</h1>、<br>、<hr>等众多的标签,它们所定义的文本、图像等将会在浏览器的框内显示出来。

该标签必须成对使用。

<body>标签中还可以有以下属性:色彩rrggbb是用16 进制的红-绿-蓝(red-green-blue, RGB) 值来表示。

例: body.html<html><head><title>唐诗</title></head><body bgcolor="blue" text="yellow" >静晚思<br>床前明月光,疑是地上霜。

<br>举头望明月,低头叫故乡。

<br></body.></html>1.5 格式标签1.5.1 段落标签<p> </p>格式:<p align=# >说明:</p>标签是用来创建一个段落,在此标签之间加入的文本将按照段落的格式显示在浏览器上。

HTML自动在一个段落前后各添加一个空行。

align可以控制段落的对齐方式,取值为:Left(左对齐)、Center(居中)和Right(右对齐)三个值中的任何一个。

例:<body><p align=”center”>浣溪沙</p><p>一曲新词酒一杯,去年天气旧亭台,夕阳西下几时回。

无可奈何花落去,似曾相识燕归来。

小园香径几徘徊。

</p></body>1.5.2 换行标签<br>当需要结束一行,并且不想开始新段落时,使用<br>标签。

<br>标签不管放在什么位置,都能够强制换行。

它是单标签。

例:<body><p align=”center”>浣溪沙</p><p>一曲新词酒一杯,去年天气旧亭台,<br>夕阳西下几时回。

无可奈何花落去,<br> 似曾相识燕归来。

小园香径几徘徊。

</p></body>1.5.3 文章标题标签Hn一般文章都有标题、副标题、章和节等结构,HTML中也提供了相应的标题标签<Hn>,其中n为标题的等级,HTML总共提供六个等级的标题,n越小,标题字号就越大,以下列出所有等级的标题:〈H1>…</H1>第一级标题〈H2>…</H2>第二级标题〈H3>…</H3>第三级标题〈H4>…</H4>第四级标题〈H5>…</H5>第五级标题〈H6>…</H6>第六级标题例:<body>这是一行普通文字<P>〈H1>一级标题</H1>〈H2>二级标题</H2>〈H3>三级标题</H3>〈H4>四级标题</H4>〈H5>五级标题</H5>〈H6>六级标题</H6></body>1.5.4 预格式化文本<pre></pre>为控制换行和空格,可以预先设定好文本的格式例:<body><pre> 浣溪沙一曲新词酒一杯,去年天气旧亭台,夕阳西下几时回。

无可奈何花落去,似曾相识燕归来。

小园香径几徘徊。

</pre></body>1.5.5 环绕标签格式: <marquee direction=# bihavior=* loop=数字scrollamount=数字scrolldelay=数字scrollamount=数字height=数字width=数字> ... </marquee>说明:方向属性direction=# #=left,right,up,down例:<marquee direction=left>啦啦啦,我从右向左移!</marquee><marquee direction=right>啦啦啦,我从左向右移!</marquee>方式属性bihavior=* 8=scroll,slide,alternate例:<marquee behavior=scroll>啦啦啦,我一圈一圈绕着走!</marquee><marquee behavior=slide>啦啦啦,我只走一次就歇了!</marquee><marquee behavior=alternate>啦啦啦,我来回走耶!</marquee>循环次数loop,若未指定则循环不止(infinite)速度属性scrollamount=数字延时属性scrolldelay=数字例:<marquee scrolldelay=500 scrollamount=100>啦啦啦,我走一步,停一停!</marquee> 面积属性height=数字width=数字例:<marquee height=40 width=50% bgcolor=”red”>啦啦啦,我会移动耶!</marquee>这些属性可以单独使用,也可混合使用,下面是一个综合实例:例:制作滚动的新闻<body><marquee id="a" behavior="scroll" direction="up" height="150" width="150" bgcolor="#FFCC00" scrollamount="2" onmouseover="a.stop()" onmouseout="a.start()"> <p>当鼠标指向时停止当鼠标移过时滚动<br>当鼠标指向时停止当鼠标移过时滚动<br>当鼠标指向时停止当鼠标移过时滚动<br></p></marquee></body>其中id为这段文本的名称,要注意的是一个环绕标签只对一个段落起作用。

相关文档
最新文档