HTML 入门

01-HTML1.1 简介HTML 全称为 HyperText Markup Language译为超文本标记语言不是一种编程语言是一种描述性的标记语言用于描述超文本中内容的显示方式。比如字体什么颜色大小等。超文本音频视频图片称为超文本标记英文单词或字母称为标记一个html页面都是由各种标记组成普通文本自包含文字HTML 是负责描述文档语义的语言HTML 语言不是一个编程语言(有编译过程)而是一个标记语言(没有编译过程)HTML 页面直接由浏览器解析执行。1.2 HTML 发展历史HTML 1.0在1993年6月作为互联网工程工作小组IETF工作草案发布HTML 2.01995年1 1月作为 RFC 1866发布于2000年6月发布之后被宣布已经过时HTML 3.21997年1月14日W3C 推荐标准HTML 4.01997年12月18日W3C 推荐标准HTML 4.01微小改进1999年12月24日W3C 推荐标准HTML 5HTML5 是公认的下一代Web语言极大地提升了 Web 在富媒体、富内容和富应用等方面的能力被喻为终将改变移动互联网的重要推手。Internet Explorer 8及以前的版本不支持1.3 HTML 结构示例!DOCTYPE htmlhtmlheadmeta charsetutf-8titleDocument/title/headbodyh1我的第一个标题/h1p我的第一个段落/p/body/html结构说明!DOCTYPE html 声明为 HTML5 文档html 元素是 HTML 页面的根元素head 元素包含了文档的元meta数据如 meta charsetutf-8 定义网页编码格式为 utf-8title 元素描述了文档的标题body 元素包含了可见的页面内容h1 元素定义一个大标题p 元素定义一个段落02-Sublime Text上面已经介绍了 HTML接下来就是去学习掌握。在掌握之前需要先下载个成手的工具老话说 工欲善其事必先利其器。Sublime Text官网https://www.sublimetext.com2.1 使用1打开软件新建文件2点击Plain Text 选择 html3快捷创建 h5 初始代码4出现如下代码就可以了03-HTML 标签3.1 简介HTML 标记标签通常被称为 HTML 标签 (HTML tag)HTML 标签是由尖括号包围的关键词比如 htmlHTML 标签通常是成对出现的比如 b 和 /b标签对中的第一个标签是开始标签第二个标签是结束标签开始和结束标签也被称为开放标签和闭合标签HTML 属性是 HTML 标签提供的附加信息HTML 标签可以设置属性属性可以在标签中添加附加信息属性一般描述于开始标签属性总是以名称/值对的形式出现比如namevalue语法标签 属性名属性值内容/标签3.2 常用标签1标题语法h1~6 1到6字体越来越小特点自动换行加粗。属性align对齐方式left左center中right右justify两端对齐title鼠标停留弹出标题提示dir文本方向ltr从左到右默认值rtl从右到左2段落语法p特点自动换行。属性align对齐方式title鼠标停留弹出标题提示dir文本方向3超链接语法a特点非自动换行。属性href跳转地址值可以具体的域名或 IP 地址也可以是具体资源路径图片会展示文件会下载还可以作为锚链接使用 #id 名称定位到 id 名称所在的标签位置target指定在何处打开_blank在新的窗口打开_self在当前窗口打开title鼠标停留弹出标题提示4行内容器语法span特点非自动换行。属性title鼠标停留弹出标题提示5字体语法font特点非自动换行。属性title鼠标停留弹出标题提示color字体颜色size字体大小值1到7face字体样式6加粗语法b特点字体加粗。7倾斜语法i特点字体倾斜。8下划线语法u特点字体加上下划线。9删除线语法del特点字体附上横杠。10放大语法big特点字体放大效果。11上标语法sup特点字体向上移动。12下标语法sub特点字体向下移动。13水平线语法hr特点水平直线。14换行语法br特点换行。15图片语法img特点非自动换行。属性width宽度单位 px可以省略height高度title鼠标停留弹出标题提示alt加载失败展示内容16列表[1] 无序列表语法ulli/li/ul特点自动换行没有序号。[2] 有序列表语法olli/li/ol特点自动换行有数字序号。[3] 自定义列表语法dldt/dtdd/dd/dl特点自动换行没有序号有标题dt。17表格语法tabletrth/th/trtrtd/td/tr/table特点自动换行th 是表头同样用 td 当做表头也是可以。属性align对齐方式可以用在 tabletrthtdborder边框宽度用在 tablewidth宽度用在 tabletdheight高度用在 tabletdvalign垂直对齐方式用在 trtop上middle中默认bottom下colspan横向合并用在 tdrowspan纵向合并用在 td18文本框语法input特点非自动换行。属性type输入框类型这个标签根据 typebutton 也可以作为按钮输入的值不存在默认是文本text文本password密码email邮箱url网址number数字range滑块time时间date日期color颜色radio单选checkbox多选hidden隐藏button普通按钮submit提交按钮reset重置按钮file文件按钮name对应参数名称用于表单提交数据value对应输入值当 type 为按钮时value 为按钮上的文字placeholder提示信息maxlength支持输入最大长度minlength支持输入最小长度autofocus自动获取焦点disabled禁用状态readonly只读状态19下拉列表语法selectoption/optionoption/optionoption/option/select特点非自动换行。属性selected默认选中作用在 optionname对应参数名称用于表单提交数据作用在 selectdisabled禁用状态作用在 option20文本域语法textare特点非自动换行。属性name对应参数名称用于表单提交数据21表单语法form特点自动换行。属性action发送数据的地址method提交方式get用于 Get 请求的接口请求参数量小post用于 Post 请求的接口请求参数量大22滚动语法marquee特点非自动换行。属性bgcolor背景颜色width宽度height高度scrollamount加快速度单位毫秒scrolldelay放慢速度单位毫秒23内联语法iframe特点非自动换行。属性srcurl地址width宽度height高度name对应 name 名称24盒子语法div特点自动换行。25分组框语法fieldsetlegendPersonal Information/legend/fieldset特点自动换行使用fieldset和legend可以提高表单的可读性和可访问性。属性disabled如果设置了这个属性fieldset中的所有表单控件都会被禁用form指定一个与fieldset相关联的表单的 idname给fieldset一个名字在表单提交时可以使用26按钮语法button特点非自动换行,它与input typebutton相比有更多的灵活性因为button标签可以包含内容如文本、图标、甚至 HTML 元素。属性type指定按钮的类型submit提交表单默认类型reset重置表单中的所有输入内容button不执行默认行为只用于执行自定义脚本disabled禁用