Web前端开发案例教程——HTML+CSS+JavaScript (1).pptVIP

定义描述标签 …… body dl dt《春思》 作者：李白/dt dd燕草如碧丝，秦桑低绿枝。/dd dd当君怀归日，是妾断肠时。/dd dd春风不相识，何事入罗帏？/dd dl /body …… 常用于布局的块级标签 因dt是块状元素，常用于图文混编的布局场合 实例1-7：dl和dt标签 dl dt标题/dt dd描述1/dd …… /dl 表格 常用于布局的块级标签 table--表格 tr --行 td --列（单元格） 实例代码1-8：表格标签 table border=2 tr td第一行第一列/td td第一行第二列/td /tr tr td第二行第一列/td td第二行第二列/td /tr /table 常用于布局的块级标签 表单 一般和table使用： form table tr td.../td td.../td /tr /table /form 实例代码1-9：表单标签 form …… /form 常用于布局的块级标签 分区标签 div 一般当作结构化块状元素使用，作为逻辑分区（分块）即容器来使用 …… div style=width:450px; height:260px; background:#9FF p div其实就是一个划分逻辑区域的标签，常用作容器，div内可包括标题、段落、无序列表、有序列表、定义列表、表格、表单等内容/p h3《春思》 作者：李白/h3 ol li燕草如碧丝，秦桑低绿枝。/li li当君怀归日，是妾断肠时。/li li春风不相识，何事入罗帏？/li /ol div还可以包括普通的文字、图片等内容 /div …… 实例1-10：分区标签 小结 1、div-ul(ol)-li ：常用于分类导航或菜单等 2、div-dl-dt-dd ：常用于图文混编的场合 3、table-tr-td ：常用于图文布局或显示数据 4、form-table-tr-td：常用于布局表单 常用的4种块状结构 常用于布局的块级标签 实现简单的商品购买页 分析应使用哪些标签？ 1.5行级标签 常用图片格式对比 图像标签img/ 范围标签span 换行标签br/ 超链接标签a 图像标签 …… img src=images/1.jpg alt=八大怪：面条像裤带 title=八大怪：面条像裤带 / …… 1.5行级标签 为了不同浏览器之间的兼容，推荐使用title属性 ，确保能显示提示文字 实例1-11：图像标签 img src= 图片地址 alt=提示文字 title=提示文字 / 范围标签span ：显示某行内的独特样式 …… p八大怪：span style=color:red;font-size:50px;面条像裤带/span/p …… 1.5行级标签 实例1-12：span标签 span 文本等行级内容/span 设置红色、大号字突出显示 * * * * * * * * 过度： 标准的由来，多个浏览器厂商的竞争、HTML编码混乱 标准的由来，多个浏览器厂商的竞争、HTML编码混乱 遵守国际化WEB标准，确保多个浏览器都兼容 W3C-万维网联盟，负责制定web行业标准，它包括一系列的标准。 重点强调我们这门课程需要严格遵守HTML 4.0.1/标准XHTML1.0，两者兼容。 说明：具体规范将随课程边学边告诉大家，DOM和ECMAScript下学期会学习； * HTML基础 第一章 本章目标 了解web基本概念及HTML的发展史 使用HTML的基本结构创建网页 使用行级和块级标签组织页面内容 使用图像标签实现图文并茂的页面 1.1web概述 1.1.1Web客户端技术 HTML是Hypertext Markup Language（超文本标记语言）的缩写，它是构成Web页面的主要工具。HTML用于编辑文档的逻辑结构。 CSS是Cascading Style Sheets（层叠样式表）的缩写。通过在HTML文档中设立样式表，可以统一控制HTML中各标志外观显示属性。 JavaScript脚本语言，它是嵌入在HTML文档中的程序。使用脚本程序可以创建动态页面，大大提高交互性。 1.1web概述 1.1.1Web服务端技术 PHP(Personal Home Page Tools)技术 ASP.NET技术