1 / 24
文档名称:

HTML10笔记.docx

格式:docx   大小:2,078KB   页数:24页
下载后只包含 1 个 DOCX 格式的文档,没有任何的图纸或源代码,查看文件列表

如果您已付费下载过本站文档,您可以点这里二次下载

分享

预览

HTML10笔记.docx

上传人:才艺人生 2024/5/9 文件大小:2.03 MB

下载得到文件列表

HTML10笔记.docx

相关文档

文档介绍

文档介绍:该【HTML10笔记 】是由【才艺人生】上传分享,文档一共【24】页,该文档可以免费在线阅读,需要了解更多关于【HTML10笔记 】的内容,可以使用淘豆网的站内搜索功能,选择自己适合的文档,以下文字是截取该文章内的部分文字,如需要获得完整电子版,请下载此文档到您的设备,方便您编辑和打印。HTML10笔记使用DIV+CSS布局网页、使用CSS美化网页、制作精美的商业网站。会使用HTML的基本结构创建网页,会使用文本相关标签排版文本信息,会使用图像相关标签实现图文并茂的页面,会使用a标签创建超链接、锚链接以及功能性链接。HTML:HyperText(超文本)Markup(构造)Language。DIV:层叠样式表中的定位技术DIVision,划分、图层;编程中叫整除。CSS:CascadingStyleSheets,层叠样式表、级联样式表,一种用来表现HTML或XML等文件样式的计算机语言,能做到网页表现与内容分离的一种样式语言。:<html><head><title>页面名称、标题</title></head>//文件的头部<body><!DOCTYPEhtmlPUBLIC"-//W3C////EN""/xhtml1/DTD/xhtml1-">//Strict(严格类型)、Transitional(过渡类型)、Frameset(框架类型)<htmlxmlns="9/xhtml">//网页网址<head><metahttp-equiv="Content-Type"content="text/html;charset=gb2312"/><title>无标题文档</title></head><body></body></html>如果使用Dreamweaver创建网页,。:a:标题标签:通常用于标题或主题,体现标签语义化。(1)标题的特点:文字变大,上下有间距。(2)使用标签:<h1></h1>....<h6></h6>(文字由大变小)b:段落标签:特点:文字大小不变,用来标示这是一段文字,具有换行功能。标签:<p></p>c:换行标签:<br/>特点:只换行,不设置上下间距d:水平线标签:<hrwidth=""align=""/>说明:width设置宽度,单位可以给百分比,或者多少px像素。align设置水平对齐方式,取值:left、center(默认)、right。 示例:width="50%"或者width="200px"e:设置文字格式:(1)加粗:<strong></strong>(2)倾斜:<em></em>注意:如果出现标签嵌套,一定要注意嵌套关系,不要交叉嵌套错误代码:<strong><em>aaaa</strong></em>,改正:<strong><em>aaa</em></strong>。f:特殊符号以及转义码:空格: 、版权符:©、小于号:<、大于号:>、&quotg:<title>标签:网页名h:<meta>标签<metahttp-equiv="Content-Type"content="text/html;charset=gb2312"/>//网页的字符编码,网页常用的字符编码有gb2312、utf-8 <metaname="keywords"content="中软高科"/>//搜索关键词 <metaname="description"content="中软高科是国内最大的......"/>//:常用的图片格式:JPG(JPEG)、GIF(JPG、GIF是网页中最常用的格式)、PNG(受浏览器兼容性的限制)、BMP语法:<imgsrc="path"width="x"height="y"title="text"alt="text"/>说明:src:图片的路径、width:图片宽度、height:图片高度、title:鼠标悬停提示文字、alt:图像的替代文字,alt属性常和src配合使用。示例:<imgsrc=""width="20px"height="20px"title="图片"alt="图片"/>说明:说明img标签的与之前学****的<br/>标签一样,不是成对的标签,直接在最后以"/"闭合,体现标签的语义化。:<ahref="path"target="目标窗口位置">链接文本或图像</a>功能:实现多个页面之间的跳转语法:<ahref="跳转的页面">文本或图片</a>示例:文本超链接:<ahref=""target="_blank">无漂白薄皮核桃</a>图像超链接:<ahref=""target="_blank"><imgsrc="image/"alt="无漂白薄皮核桃"title="无漂白薄皮核桃"/></a>特殊值:当href="#"时表示刷新示例:<ahref="#">刷新</a>补充:<ahref=""target="窗口的打开方式"></a>:链接在哪个窗口打开target="_self"表示:相对路径,在当前窗口中打开新页面target="_blank"表示:绝对路径,:(1)多页面跳转:从一个页面链接到另外一个页面,网站上使用最多的就是页面间链接,例如网站导航菜单、新闻列表、商品列表等链接,通常都是页面间链链。(2)单页面内容跳转(锚链接:从A页面的甲位置跳转到本页中的乙位置,从A页面的甲位置跳转到B页面中的乙位置。)实现步骤::<aname="自定义值">文本</a>示例:<aname="abc">第一章内容开始</a>:<ahref="#自定义值">文本</a>示例:<ahref="#abc">第一章花千骨1</a>整体效果:点击花千骨1,快速跳转到文章开始位置(3)功能性跳转:跳转到电子邮件(Outlook)、QQ、MSN语法:<ahref="mailto:收件人的邮箱地址">文本</a>会使用有序列表实现数据展示,会使用无序列表实现数据展示,会使用定义列表实现数据展示,会使用表格实现数据展示,会使用<iframe>进行页面设计。无序列表和定义列表在网页制作中应用非常广泛,使用<iframe>可以重用页面内容,在制作网页时可以减少工作量。:有序列表、无序列表、自定义列表(定义列表常用于图文混排的局部布局):<ultype="项目符号">//声明无序列表<li></li>//声明列表项<li></li></ul>说明:一对li表示一个列表项,<ul>和<li>标签均为成对出现。列表项中可以包含图片、文本,还可以嵌套列表、其他标签等。type="disc":项目符号显示为尸体圆心,默认值。type="square":项目符号显示为实体方心type="circle":项目符号显示为空心圆。注意:type可改变无序列表的项目符号即可,并且说明在实际网页制作中通常使用CSS来设置项目符号。:<ol>//声明有序列表<li></li>//声明列表项</ol>说明:<ol>和<li>标签均为成对出现,有序列表默认以数字序号显示,与无序列表一样,也可以嵌套列表、可以包含图片、文本、其他标签等设置项目符号:type="1/a/A/i/I":使用数字作为项目符、使用大写/小写字母作为项目符号、使用大写/小写罗马数字作为项目符号。:<dl>//声明定义列表<dt>列表项标题</dt>//声明列表项<dd>列表项内容</dd>//定义列表项内容