1.1 案例一：网站信息页面的显示：1.1.1 需求： 在网页中显示网站的信息的页面：效果如下： 1.1.2 分析:1.1.2.1 技术分析： 【HTML的概述】 Ø 什么是HTML HTML:Hyper Text Markup Language --- 超文本标记语言. * 标记语言：指的是通过一组标签的形式描述事物的一门语言. * 超文本：比普通的文本更强大. Ø HTML的作用 HTML是用来制作页面(静态页面). Ø HTML在那些地方使用 在设计网站的页面的时候都要使用到HTML. 【HTML的使用】 Ø HTML的文件的创建 一个HTML文件,扩展名是.html或者.htm结尾 * 01.html Ø HTML的结构标签 * 跟标签:<html></html> * <head> -- html的头标签 * <body> -- html的体标签 【HTML的字体标签】 Ø <font>标签:HTML中的字体标签. [AppleScript] 纯文本查看 复制代码 ? 01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 使用： < font > 文字 < / font > * < font > 标签的属性 : * < 标签 属性名 = ”属性值” 属性名 = ”属性值” > < / 标签 > * 属性 : * color属性 : 字体颜色 * 英文单词设置 : black , red , green , blue... * 使用 16 进制数设置 : #FFFFFF , #FFF * size属性 : 字体的大小 * face属性 : 字体 * 基本使用： < font > 我是HTML! < / font > < br / > < font color = "red" > 我是HTML！ < / font > < br / > < font color = "#FF0000" size = "1" > 我是小红！ < / font > < br / > < font color = "#00FF00" size = "7" > 我是小绿！ < / font > < br / > < font color = "#0000FF" size = "100" > 我是小蓝！ < / font > < br / > 【HTML的排版标签】 Ø 标题标签：h标签<h1>...<h6> [AppleScript] 纯文本查看 复制代码 ? 1 2 3 4 < ! -- HTML的标题标签 --> < h 1 > 一级标题 < / h 1 > < h 2 > 二级标题 < / h 2 > < h 3 > 三级标题 < / h 3 > Ø 段落标签：p标签 [AppleScript] 纯文本查看 复制代码 ? 01 02 03 04 05 06 07 08 09 10 < p > 一段内容内容一段内容内容一段内容内容一段内容内容一段内容内容一段内容内容一段内容内容一段内容内容一段内容内容 一段内容内容一段内容内容一段内容内容一段内容内容一段内容内容一段内容内容一段内容内容一段内容内容一段内容内容 一段内容内容一段内容内容一段内容内容一段内容内容一段内容内容一段内容内容一段内容内容一段内容内容一段内容内容 一段内容内容一段内容内容一段内容内容一段内容内容一段内容内容一段内容内容一段内容内容一段内容内容一段内容内容 < / p > < p > 一段内容内容一段内容内容一段内容内容一段内容内容一段内容内容一段内容内容一段内容内容 一段内容内容一段内容内容一段内容内容一段内容内容一段内容内容一段内容内容一段内容内容 < / p > Ø 字体加粗标签：b标签 <b>黑马训练营</b> Ø 字体斜体标签：i标签 <i>黑马训练营</i> Ø 字体下划线：u标签 <u>黑马训练营</u> Ø 居中标签：<center>标签 <center>内容</center> 1.1.2.2 步骤分析: 【步骤一】创建一个HTML的文档 【步骤二】设置标题 【步骤三】设置四个段落 【步骤四】使用字体标签将第一个段落中的某个部分的内容变为红色. 1.1.3 代码实现: [AppleScript] 纯文本查看 复制代码 ? 01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 < !DOCTYPE html > < html > < head > < meta charset = "UTF-8" > < title > 网站信息页面 < / title > < / head > < body > < h 1 > 公司简介 < / h 1 > < hr / > < p > < font color = "red" > “中关村黑马程序员训练营” < / font > 是由 < b > 传智播客 < / b > 联合中关村软件园、CSDN，并委托传智播客进行教学实施的软件开发高端培训机构，致力于服务各大软件企业，解决当前软件开发技术飞速发展，而企业招不到优秀人才的困扰。 目前，“中关村黑马程序员训练营”已成长为行业“学员质量好、课程内容深、企业满意”的移动开发高端训练基地，并被评为中关村软件园重点扶持人才企业。 < / p > < p > 黑马程序员的学员多为大学毕业后，有理想、有梦想，想从事IT行业，而没有环境和机遇改变自己命运的年轻人。黑马程序员的学员筛选制度，远比现在 90 %以上的企业招聘流程更为严格。任何一名学员想成功入学“黑马程序员”，必须经历长达 2 个月的面试流程，这些流程中不仅包括严格的技术测试、自学能力测试，还包括性格测试、压力测试、品德测试等等测试。毫不夸张地说，黑马程序员训练营所有学员都是精挑细选出来的。百里挑一的残酷筛选制度确保学员质量，并降低企业的用人风险。 < / p > < p > 中关村黑马程序员训练营不仅着重培养学员的基础理论知识，更注重培养项目实施管理能力，并密切关注技术革新，不断引入先进的技术，研发更新技术课程，确保学员进入企业后不仅能独立从事开发工作，更能给企业带来新的技术体系和理念。 < / p > < p > 一直以来，黑马程序员以技术视角关注IT产业发展，以深度分享推进产业技术成长，致力于弘扬技术创新，倡导分享、 开放和协作，努力打造高质量的IT人才服务平台。 < / p > < / body > < / html > 1.1.4 总结: [AppleScript] 纯文本查看 复制代码 ? 1 2 3 4 5 6 7 8 HTML有标准 : * HTML 4 * < !DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" > * HTML 5 : 支持视频播放 , 支持CSS 3 , 支持定位 , 扩展标签... * < !DOCTYPE html > < pre > 标签：原生标签. < hr / > 标签：横线.
扫一扫
445
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
