HTML初级知识点总结最详细的总结_第1页
HTML初级知识点总结最详细的总结_第2页
HTML初级知识点总结最详细的总结_第3页
HTML初级知识点总结最详细的总结_第4页
HTML初级知识点总结最详细的总结_第5页
已阅读5页，还剩1页未读， 继续免费阅读

下载本文档

版权说明：本文档由用户提供并上传，收益归属内容提供方，若内容存在侵权，请进行举报或认领

文档简介

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/>,单标记，不需要完毕标记，换行但不分段 空格符号： 表示一个空格 强制换行符：<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，默认是1 start控制列表的起始值，取值为任意的整数 li的属性：type控制选项自身的符号样式，取值1|A|a|i|I value控制选项本身的起始值，取值为任意整数，但是修改自身起始值之后，会对同一个列表中本选项之后的同级<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引入图片资源的路径 绝对路径：资源在效劳器上的位置，该位置是从盘符出发 相对路径：资源在效劳器上的相对位置，从网页本身出发 ..\返回上一层文件夹 width控制显示图片的宽度，取值为像素或者百分数 height控制显示图片的高度，取值为像素或者是百分数 只设置宽度或高度时，图片保持等比缩放，同时设置时，同时生效 border控制显示图片的边框，取值为像素，默认不显示边框 hspace控制显示图片水平方向上的空白，取值为像素 vspace控制显示图片垂直方向上的空白，取值为像素 align控制图片和周围文本的对齐方式 垂直方向上：top文本和图片顶部对齐 bottom文本底部和图片底部对齐 middle文本的底部和图片的中部对齐 absmiddle绝对中间对齐，文本的中部和图片的中部对齐 水平方向上：left图片在左，文本在右 right文本在左，图片在右 图片的对齐方式： 借助<div>或者<p> 四.在网页中使用超链接4、超链接 标记：<a>...</a>,通过链接跳转到新的资源 属性：href链接的目标资源的路径 链接外部资源时，一定是绝对路径，并且需要在路径前加上【://】这个网络通信协议 target指定超链接的翻开方式，_self在自身的页面翻开超链接(默认的翻开方式)，_blank重新翻开一个新的浏览器窗口建立锚点〔书签〕 内部书签 1、设置锚点的名称例如：<aname="锚点名">...</a> 2、使用超链接完成跳转例如：<ahref="#锚点名">...</a> 外部书签 1、设置锚点的名称例如：<aname="锚点名">...</a> 2、使用超链接完成跳转例如：<ahref="锚点所在页面的路径#锚点名">...</a> 超链接 发送电子邮件，格式<ahref="mailto:邮箱地址">发送邮件</a> 2、链接多媒体 五.表格的应用 表格的构造 <table>---声明表格 <caption>...</caption>---表格的标题 <tr>----表格的行 <td>....</td>---表格的列 </tr> <tr>----表格的行 <td>....</td>---表格的列 </tr> </table> <table>标记，定义表格，所有表格的内容书写在<table>开场和</table>完毕标记之间 属性：frame控制表格最外层的四个边框 取值： void默认值，不显示边框 above仅显示上边框 below仅显示下边框 hsides显示上下边框 vsides显示左右边框 lhs仅显示左边框 rhs仅显示右边框 box、border显示四个边框 rules控制表格内局部割线 取值： none默认值，不显示 rows显示行分割线 cols显示列分割线 all显示所有分割线 bordercolor控制边框的颜色 border控制表格的所有边框，取值为像素 cellspacing控制单元格及单元格之间的空白，取值为像素 cellpadding控制单元格内容和单元格边框之间的空白，取值为像素 width设置单元格的宽度，取值为像素或者百分数 height设置单元格的高度，取值为像素或者百分数 align控制表格的对齐方式，取值left(默认值)|center|right bgcolor设置表格的背风光 background设置表格的背景图 当背风光和背景图同时设定时，优先使用背景图 <caption>表格的标题，必须书写在<table>之间 属性：align控制表格标题的位置，取值top(标题在表格的顶部)|bottom〔标题在表格的底部〕 <tr>定义表格的行 属性：align控制整行单元格内容的水平对齐方式，取值left〔默认值，缺省值〕|center|right valign控制整行单元格内容的垂直对齐方式，取值top|middle〔默认值〕|bottom height设置行的高度，取值为像素 bgcolor设置行的背风光 background设置行的背景图 bordercolor设置行的边框颜色 <td>列标记 <th>列标题标记 都可以作为列使用，<th>列标题标记，内容有加粗显示的效果，并且带有自动居中 属性：align控制单元格内容的水平方向对齐方式，取值left|center|right valign控制单元格内容的垂直方向对齐方式，取值top|middle〔默认值〕|bottom height设置单元格的高度，取值以像素为单位，当同一行中不同的单元格设置的高度也不一样时，整行的高度取值按最大值来 width设置单元格的宽度，取值以像素为单位，当同一列中不同行的单元格设置的宽度不一样时，整列的宽度取值按最大值来 bgcolor设置单元格的背风光 bakground设置单元格的背景图 rowspan合并行 colspan合并列 合并行和合并列的取值都是整数，合并几个单元格取值就是几 六.框架的应用 1、框架 框架集标记<frameset>，在原有的html构造根底上，<frameset>替换了<body>的位置，换句话说，<frameset>和<body>不能共存，只能出现一个 属性：rows设置横向框架的数量和高度，框架的数量取决于rows属性的取值个数，每个框架的高度取决于值的大小 cols设置纵向框架的数量和宽度，框架的数量取决于cols属性的取值个数，每个框架的宽度取决于值的大小 rows和cols的取值方式 1、像素值 2、百分数 3、比例取值 rows和cols取值，可以有多个值，值及值之间使用逗号分割，并且不能有空格格，cols和rows属性一般不同时设定，要想实现页面的纵向和横向分割，可以使用框架的嵌套来实现 frameborder使用在frameset中，可以控制框架集下的所有框架边框是否显示 框架标记<frame/>,单标记 属性：src引入目标资源的路径 name给框架起名字，需要配合超链接的target属性来使用，到达链接目标框架的目的 frameborder控制框架的边框是否显示，0表示不显示，1显示默认的3D边框 scrolling控制框架是否参加滚动条，取值yes(参加滚动条，需要时参加)|no(不参加滚动条)|auto(需要时参加滚动条，默认值) noresize固定框架的边框，该属性不需要取值 marginheight在框架中显示内容时，控制内容和框架上下边框之间的空白，取值以像素为单位，以上边框为准 marginwidth在框架中显示内容时，控制内容和框架左右边框之间的空白，取值以像素为单位，以左边框为准 <noframes>当浏览器不支持框架时，显示的替换内容，必须包含一对<body>标记使用表单的应用表单 1.表单标记<form>,表单不能嵌套使用，所有表单的内容必须书写在表单的开场标记和完毕标记之间表单构造：<form><inputtype=〞text〞>单行文本格式<inputtype=〞password〞> 密码输入框<inputtype=〞checkbox〞>复选框格式<inputtype=〞radio〞name=〞sex〞>单项选择框格式<inputtype=〞submit〞>提交的格式<inputtype=〞reset〞>重置格式<inputtype=〞button〞>自定义格式<select>下拉菜单格式 <option>汉族</option> <option>满族</option><option>壮族</option><option>土家族</option></select><textarea>cols="50"rows="4">请多多指教多行文本</textarea>

人人文库> 全部分类> 教育资料 > 中学教育

温馨提示

  • 1. 本站所有资源如无特殊说明，都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
  • 2. 本站的文档不包含任何第三方提供的附件图纸等，如果需要附件，请联系上传者。文件的所有权益归上传用户所有。
  • 3. 本站RAR压缩包中若带图纸，网页内容里面会有图纸预览，若没有图纸预览就没有图纸。
  • 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
  • 5. 人人文库网仅提供信息存储空间，仅对用户上传内容的表现方式做保护处理，对用户上传分享的文档内容本身不做任何修改或编辑，并不能对任何下载内容负责。
  • 6. 下载文件中如有侵权或不适当内容，请与我们联系，我们立即纠正。
  • 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。

最新文档

评论

0/150

提交评论