HTML初步学习笔记

“玩转”Java系列—————————————————————————————1【更多Java–Android资料下载，可访问尚硅谷（中国）官网下载区】HTML初步1HTML概念1.1用来描述网页的一种语言1.2HyperTextMarkupLanguage超文本标记语言1.3HTML不是一种编程语言，而是一种标记语言(markuplanguage)。通常来说，至少要具备数据容器、流程控制、异常处理机制等特性才能够称为一门编程语言。标记语言的组成元素是一套标记标签(markuptag)，HTML使用标记标签来描述网页2第一个HTML文档：HelloWorld2.1新建一个纯文本文件2.2将扩展名修改为.html或.htm——两种均可，但同一项目中一定要统一2.3用记事本打开并编辑如下代码2.4在IE（或Chrome、Opera、FireFox等浏览器）中打开，显示效果是：“玩转”Java系列—————————————————————————————2【更多Java–Android资料下载，可访问尚硅谷（中国）官网下载区】3HTML文档规范3.1格式良好的HTML文档标签必须正确关闭正确关闭：未正确关闭：单标签也要正确关闭：单标签未正确关闭：3.2格式良好的HTML文档标签不能交叉嵌套3.3格式良好的HTML文档标签可以有属性，但属性必须有值，且属性值必须使用引号引起来，单引号、双引号均可，但推荐使用双引号“玩转”Java系列—————————————————————————————3【更多Java–Android资料下载，可访问尚硅谷（中国）官网下载区】4HTML注释5在eclipse中创建HTML文档6HTML文档的构成“玩转”Java系列—————————————————————————————4【更多Java–Android资料下载，可访问尚硅谷（中国）官网下载区】6.1文档类型声明6.1.1!DOCTYPE声明位于文档中的最前面的位置，处于html标签之前。此标签可告知浏览器文档使用哪种HTML或XHTML规范。6.1.2HTML4.01规定了三种文档类型：Strict、Transitional以及FramesetStrict：严格。如果您需要干净的标记，免于表现层的混乱，请使用此类型。请与层叠样式表（CSS）配合使用Transitional：过度。TransitionalDTD可包含W3C所期望移入样式表的呈现属性和元素。如果您的读者使用了不支持层叠样式表（CSS）的浏览器以至于您不得不使用HTML的呈现特性时，请使用此类型Frameset：框架。被用于带有框架的文档。除frameset元素取代了body元素之外，FramesetDTD等同于Transitional6.1.3!DOCTYPE标签没有结束标签6.2页面元信息6.2.1meta元素可提供有关页面的元信息（meta-information），比如针对搜索引擎和更新频度的描述和关键词。6.2.2meta标签位于文档的头部，不包含任何内容。可以有多个meta标签的属性定义了与文档相关联的“名称/值对”。由name或http-equiv属性定义“名称/值对”中的名称由content属性定义“名称/值对”中的值如：name=“keywords”content=“java培训,北京Java培训,java课程„”设置关键字，使网页更容易被搜索引擎找到如：name=“description”content=“尚硅谷java培训革命者，„”网页描述当服务器向浏览器发送文档时，会先发送许多名称/值对。虽然有些服务器会发送许多这种名称/值对，但是所有服务器都至少要发送一个：content-type:text/html。这将告诉浏览器准备接受一个HTML文档“玩转”Java系列—————————————————————————————5【更多Java–Android资料下载，可访问尚硅谷（中国）官网下载区】6.2.3HTML与XHTML之间的差异在HTML中，meta标签没有结束标签。在XHTML中，meta标签必须被正确地关闭。6.2.4注意：meta标签永远位于head元素内部。元数据总是以名称/值的形式被成对传递的。7制作表格7.1代码：效果：7.2显示表格线CSS代码：效果：7.3合并单元格跨行合并表头定义表格的行单元格，相当于表格的列表头，加粗显示tr定义的行td定义的单元格“玩转”Java系列—————————————————————————————6【更多Java–Android资料下载，可访问尚硅谷（中国）官网下载区】跨列合并8制作表单8.1form„/form标签①action属性：规定当提交表单时，向何处发送表单数据。action是一个必须有的属性，它的值是一个URL②method属性：规定如何发送表单数据。GET：规定以GET请求提交表单POST：规定以POST请求提交表单③enctype属性：规定在发送到服务器之前应该如何对表单数据进行编码，不上传文件时不需要指定该属性multipart/form-data：在上传文件时指定该值即可将被覆盖的单元格删掉表示在垂直方向上跨两行占据两个单元格的位置“玩转”Java系列—————————————————————————————7【更多Java–Android资料下载，可访问尚硅谷（中国）官网下载区】8.2表单元素总览HTML标签表单元素inputtype属性值text文本框password密码框submit提交按钮reset重置按钮radio单选按钮checkbox多选框button普通按钮file文件上传框hidden表单隐藏域textarea多行的文本域select+option下拉列表8.3文本框8.4密码框8.5提交按钮文本框默认值提交文本框内容时的键提交密码框内容时的键“玩转”Java系列—————————————————————————————8【更多Java–Android资料下载，可访问尚硅谷（中国）官网下载区】8.6重置按钮8.7单选按钮要实现“一组值中只能选一个”的效果，必须设定相同的name属性值8.8多选框8.9普通按钮8.10文件上传框8.11表单隐藏域表单隐藏域在页面上没有任何显示表单隐藏域的作用是将一些不需要或不希望用户看到的信息随表单一起提交一组值被选中后提交的值将当前单选按钮设置为默认被选中“玩转”Java系列—————————————————————————————9【更多Java–Android资料下载，可访问尚硅谷（中国）官网下载区】8.12多行文本框多行文本域是用来在页面上输入大段文本的控件在表单中多行文本域是用textarea标签定义的name属性：提交表单后通过name属性引用多行文本域中的值rows属性：多行文本域控件显示多少行（高度）cols属性：多行文本域控件显示多少列（宽度）多行文本域没有value属性8.13下拉列表在表单中，下拉列表由select和option标签共同组成9超链接HTML文档中涉及到的路径问题“玩转”Java系列—————————————————————————————10【更多Java–Android资料下载，可访问尚硅谷（中国）官网下载区】10插入图片在HTML中，图像由img标签定义src属性：指定图像的URL地址alt属性：为图像定义一串预备的可替换的文本，当图像无法显示时，显示图像的位置可以显示这段文本11列表12标题标题（Heading）是通过h1-h6等标签进行定义的h1定义最大的标题。h6定义最小的标题“玩转”Java系列—————————————————————————————11【更多Java–Android资料下载，可访问尚硅谷（中国）官网下载区】不要试图用标题标签来控制字体大小13段落段落是通过p标题定义的p/p标签自带换行效果，但单纯换行的话建议使用br/标签，更专业的做法是使用CSS对元素进行合理布局14HTML颜色颜色由一个十六进制符号来定义，这个符号由红色、绿色和蓝色的值组成（RGB）。每种颜色的最小值是0（十六进制：#00）。最大值是255（十六进制：#FF）。这个表格给出了由三种颜色混合而成的具体效果15框架框架的用途是在一个窗口中，组织多个HTML文档框架结构标签（frameset）“玩转”Java系列—————————————————————————————12【更多Java–Android资料下载，可访问尚硅谷（中国）官网下载区】框架标签（Frame）框架之间页面的互相访问框架的嵌套“玩转”Java系列—————————————————————————————13【更多Java–Android资料下载，可访问尚硅谷（中国）官网下载区】不能使用框架的情况