前端基础HTML知识点汇总

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

HTML知识点汇总

第一章HTML基础知识

1、HTML简介

HTML(Hypertext Markup Language),超文本标记语言,HTML利用各种标记来标识文档的结构以及标识超链接的信息。它是从SGML(Standard Generalized Markup Language,标准通用标识语言)中的一个子集演变而来的。

2、HTML的标记组成

HTML用于描述功能的符号称为“标记”。标记在使用时必须用尖括号“<>”括起来,而且是成对出现的,无斜杠的标记表示该标记的作用开始,有斜杠的标记表示该标记的作用结束。如、

1)单标记:有些标记能完整的表达标记里的意思,只须在尖括号中输入标记名即可,这类标记叫

单标记。XHTML中要求单标记也必须闭合,即在标记“>”前添加斜杠。常见的单标记如


等。

2)双标记:双标记有头有尾,且前面的标记与后面的标记保持一致,但在后面的标记前有斜线,

语法形如:<标记>内容。例如:

段落

3)XHTML要求所有标记均为小写,且所有标记属性必须添加双引号

4)标记对不能交叉

3、HTML基本结构

网页标题

1)标记对不能放在<body>标记对中,同理,其它表示内容的标记也不能放在<head>标</p><p>记对中</p><p>2)<html></html>表示HTML语言,在<html></html>里面包含头部(<head></head>)和</p><p>内容体(<body></body>)。</p><p>3)HTML注释表示为<!--注释内容--></p><p>第二章文字与图像</p><p>1、设置文字字体、大小与颜色</p><p>语法:<font face=”宋体”size=”1”color=”red”>文字</font></p><p>1)设置文字的字体、大小、颜色需要使用<font>标签</p><p>2)Face属性设置文字字体,多种字体用逗号隔开</p><p>3)Size属性设置文字大小</p><p>4)Color属性设置文字颜色,参数值可以是RGB颜色值,如#000000,也可以用颜色的单词表示,</p><p>如red</p><p>2、设置正文的标题</p><p>语法:<h#>主题文字</h#>,其中“#”代表数字1-6中的任意一个,从数字1到数字6,标题大小排列由大到小(数字越大,标题字号就越小)。</p><p>3、设置段落</p><p>语法:<p>这里表示段落</p></p><p>4、强制换行与不换行</p><p>1)强制换行:<br /></p><p>2)强制不换行:<nobr /></p><p>5、字体标记</p><p>1)物理字体</p><p><b>…</b> 设置成粗体<i>…</i> 设置成斜体</p><p><u>…</u> 增加下划线<s>…</s> 增加删除线</p><p><sup>…</sup> 设置成上标字体<sub>…</sub> 设置成下标字体</p><p><tt>…</tt> 设置成打字机字体</p><p>2)逻辑字体</p><p><em>…</em> 强调文字<strong>…</strong> 字体加重</p><p><code>…</code> 显示编程代码<samp>…</samp> 显示救命文字</p><p><kbd>…</kbd> 显示键盘按键文字<small>…</small> 缩小文字</p><p><big>…</big> 放大文字</p><p>6、文字对齐</p><p>1)文字对齐使用标签的align属性,例如:<p align=”#”>对齐文字</p>,其中“#”代码表</p><p>示方位,可选择”left”(向左)、”right”(向右)、”center”(居中)。Align属性可用于<p>、<div>、<table>、<td>等标签。</p><p>2)居中对齐可使用<center>标签,例如:<center>居中文字</center></p><p>7、列表</p><p>1)无序列表</p><p><ul type=”#”></p><p><li>表项一</li></p><p><li>表项二</li></p><p></ul></p><p>Type=”#”取值可为disc(默认,实心黑点)、square(实心黑方块)、circle(空心圆)</p><p>2)有序列表</p><p><ol type=”#”></p><p><li>表项一</li></p><p><li>表项二</li></p><p></ol></p><p>Type=”#”取值可为A、a、I、i、1等</p><p>3)定义列表</p><p><dl></p><p><dt>项目</dt></p><p><dd>描述一</dd></p><p><dd>描述二</dd></p><p></dl></p><p><dt>标签定义了定义列表中的项目,<dd>标签在定义列表中定义条目的定义部分,可以理解为对定义条目进行特征描述。</p><p>4)无序列表、有序列表、定义列表间可以相互嵌套,但一定要注意嵌套时不能交叉</p><p>8、其它方式修饰文本</p><p>1)欲格式化文本:<pre>…</pre></p><p>2)代码样式斜体字渲染:<var>…</var></p><p>3)表示它所包含的文本对某个参考文献的引用:<cite>…</cite></p><p>9、图像</p><p>1)插入图像基本语法:<img src=”#”/>,其中#代表图像的URL路径,示例:<img src=”</p><p>c.jpg”/></p><p>2)图像无法显示时的提示信息,使用alt属性,如:<img src=”c.jpg”alt=”风景”/></p><p>3)图像的大小:<img src=”c.jpg”width=”400px”height=”300px”/>,width属性</p><p>定义图像的宽度,height属性定义图像的高度</p><p>4)图像和文字对齐:<img src=”c.jpg”align=”top”/>,align属性的取值为top(顶部)、</p><p>middle(中间)、bottom(默认,底部)</p><p>5)图像的边框:<img src=”c.jpg”border=”0”/>,border设置为0时表示图像不显示边</p><p>框,否则设置成需要的边框大小</p><p>10、移动的字体和图片</p><p>1)移动基本语法:<marquee>移动文字或图片</marquee>,默认是向左循环移动,移动范围</p><p>在其父对象的有效区域内。</p><p>2)文本移动的方向:<marquee direction=”#”>…</marquee>,其中#可以选择left、right、</p><p>up、down</p><p>3)文本的滚动循环:<marquee behavior=”#”>…</marquee>,其中#可以选择scroll(循</p><p>环移动)、slide(只移动一个回合)、alternate(来回移动)。</p><p>4)如果设置文本来回移动,还可以设置循环次数:<marquee loop=”#”>…</marquee>,</p><p>其中#为代表循环的次数。</p><p>5)文本的移动速度:<marquee scrollamount=”#”>…</marquee>,其中#设置移动的速</p><p>度,取正整数。数值越大,速度越快。</p><p>6)移动对象的延时:<marquee scrolldelay=”1000”>我走一走,停一停</marquee>,</p> </div> </div> </div> </div> </div> <div id="rightcol" class="viewcol"> <div class="coltitle">相关文档</div> <ul class="lista"> <li><a href="/doc/182791616.html" target="_blank">web前端基础知识</a></li> <li><a href="/doc/1a3424519.html" target="_blank">web前端实习报告三篇</a></li> <li><a href="/doc/1c8408042.html" target="_blank">web前端实习报告三篇</a></li> <li><a href="/doc/1517065879.html" target="_blank">Web前端课程安排</a></li> <li><a href="/doc/2e1166646.html" target="_blank">web前端知识介绍</a></li> <li><a href="/doc/2e2399275.html" target="_blank">web前端开发知识点总结</a></li> <li><a href="/doc/262410423.html" target="_blank">前端开发面试知识点大纲</a></li> <li><a href="/doc/3d7270256.html" target="_blank">web前端开发知识点总结</a></li> <li><a href="/doc/3212533397.html" target="_blank">Web前端知识技能大汇总</a></li> <li><a href="/doc/428323355.html" target="_blank">Web前端知识点总结</a></li> </ul> <div class="coltitle">最新文档</div> <ul class="lista"> <li><a href="/doc/071000073.html" target="_blank">饭店包间名字大全</a></li> <li><a href="/doc/0d10001030.html" target="_blank">word无法创建工作文件,请检查临时环境变量</a></li> <li><a href="/doc/0d10001458.html" target="_blank">自行车健身比赛开幕式讲话词</a></li> <li><a href="/doc/0510001469.html" target="_blank">2018乡村医生个人工作总结</a></li> <li><a href="/doc/0e10002558.html" target="_blank">MySQL测试题 SQL</a></li> <li><a href="/doc/0310002568.html" target="_blank">合勤NXC5200</a></li> <li><a href="/doc/0210004833.html" target="_blank">铁路集中箱空箱调度优化建模案例(案例2)</a></li> <li><a href="/doc/021000530.html" target="_blank">微分几何教学大纲-复旦大学数学科学学院</a></li> <li><a href="/doc/031000596.html" target="_blank">人教版九年级数学上册导学案:24.1.1_圆【精品】</a></li> <li><a href="/doc/0c10006773.html" target="_blank">(整容后办护照用)医院整容证明</a></li> <li><a href="/doc/0e10006860.html" target="_blank">危险废物管理台账</a></li> <li><a href="/doc/0310008420.html" target="_blank">2017年终大会会场物料设计方案</a></li> </ul> </div> </div> <script> var did = "a6434433"; var ext = 'doc'; var docId = '1jbjozhxsg1xmi6scv6b7vgjp3qaxqqs'; var totalPage = 19; const pageNum = '19'; </script> <div class="clearfloat"></div> <div id="footer"> <div class="ft_info"> <a href="https://beian.miit.gov.cn">闽ICP备16038512号-3</a> <a href="/tousu.html" target="_blank">侵权投诉</a>  ©2013-2023 360文档中心,www.360docs.net | <a target="_blank" href="/sitemap.html">站点地图</a><br> 本站资源均为网友上传分享,本站仅负责收集和整理,有任何问题请在对应网页下方投诉通道反馈 </div> <script>foot()</script> </div> </body> </html>