html 文件就是充当模板使用，包含head头和body身体，body包含众多的标签，每个标签都使用尖括号包裹，内部由标签名和标签属性构成。其中标签分为2类： 1：块级标签，特点：占用一行，如：<h>,<p>,<div> 等 2：行内标签，特点：只占用自身大小，如：<span>,<input>,<a> 等 标签存在的意义：用于定位操作，css操作，js操作 html特殊符号参考：http://www.cnblogs.com/web-d/archive/2010/04/16/1713298.html 适用于大多数 HTML 元素的属性 属性 值 描述 class classname 规定元素的类名（classname） id id 规定元素的唯一 id style style_definition 规定元素的行内样式（inline style） title text 规定元素的额外信息（可在工具提示中显示）
<!DOCTYPE html> <!--对应关系，代表一个统一的默认规范--><html lang="en"><head> <!-- html 头--> <!-- meta：提供有关页面的元信息 --> <meta http-equiv=‘content-type‘,content=‘text/html‘,charset=‘utf-8‘> <!--页面编码--> <meta http-equiv="Refresh" Content="30"> <!-- 默认30秒刷新一次--> <meta http-equiv="Refresh" Content="5;Url=http;//www.authhome.com.cn"/> <!-- 5秒自动跳转--> <meta name="keywords" content="星级2，关键词。。"> <!--用于搜索引擎进行关键字搜索--> <meta name="description" content="描述的内容"/> <!--网站描述说明--> <meta http-equiv="X-UA-Compatible" content="IE=IE9;IE8;IE7"/> <!--进行ie的兼容 从大到小模式兼容打开--> <title>首页</title> <!-- 标题 --> <link rel="shortcut icon" href="image/favicon.ico"> <!--页面标题上的图片和位置，字串是固定的--> <!-- <style></style> css样式的时候在css文档记录说明--></head><body> <!-- html 体--><!-- 重要标签20个如下说明--><!-- HTML 标题，通过 <h1> - <h6> 等标签进行定义的，<h1> 定义最大的标题。<h6> 定义最小的标题 --><h1>This is a heading</h1><h2>This is a heading</h2><h3>This is a heading</h3><h6>This is a heading</h6>
<!-- HTML 段落 通过 <p> 标签进行定义的--><p>This is a paragraph.</p><p>This is another<br /> paragraph.</p>
<!-- HTML 链接 通过 <a> 标签进行定义的--><!-- 功能1：跳转--><a href="http://www.w3school.com.cn">This is a link</a><!-- 功能2：锚 一般用于通过目录跳转到当前页面的指定位置--><a href="#某个标签的ID">测试</a>
<!-- HTML 图像 通过 <img> 标签进行定义的--><!-- 属性 src：图片的位置--><!-- 属性 title：鼠标指向图片的提示信息--><!-- 属性 alt： 属性用来为图像定义一串预备的可替换的文本--><img src="w3school.jpg" width="104" height="142" title="鼠标提示" alt="图片信息"/>
<!-- div 可用于组合其他 HTML 元素的容器,没有特定的含义-->
<!-- span 用作文本的容器,没有特定的含义 -->
<!-- input系列 --><input type="text" name="名称" value="默认值" /><input type="password" name="名称" value="默认值" /><input type="submit" value="表单提交按钮" /><input type="button" value="登录按钮" /><!-- 单选框，多个单选框name值相同才可单选--><input type="radio" name="名称" checked="checked" value="提交的值"><!-- 多选框，批量获取数据--><input type="checkbox" name="名称" value="提交的值"><!--上传文件，依赖form表单的一个属性：enctype="multipart/form-data"（表示把文件一点一点发给服务器）--><input type="file"><input type="reset" value="重置" /><textarea name="留言框">默认值</textarea><!-- select 下拉选项 --><select name="名称" size="显示数量" multiple="multiple多选"> <option value="值1">选项1</option> <option value="值2">选项2</option></select>
<!-- table 标签 colspan:列合并单元格，rowspan：行合并单元格--><table border="1"> <thead> <tr> <th></th> <th></th> </tr> </thead> <tbody> <tr> <td></td> <td></td> </tr> </tbody></table>
<!-- label 用于点击文字，使得关联的标签获取光标--><label>文字</label>
<!-- form 表单 --><form action="http://www.baidu.com" method="GET/POST"> <input type="text" name="user" /> <input type="password" name="password" /> <!-- 提交到后台字典格式：{‘user‘:‘用户名‘,‘password‘:‘密码‘} --> <!--以GET提交数据会将所有数据拼接在URL如：http://...index.html?user=名称&password=密码 以POST提交数据URL保持不变，数据会包含在内容里一起提交--> <input type="button" value="login1"/> # 默认button没反应 <input type="submit" value="login2"/></form>
<!-- 表单举例--><form enctype="multipart/form-data"> <p>请选择</p> <!-- 选择按钮，名称必须一致才能进行选择,必须通过value值进行判断所选择的是哪个选择 --> 男：<input type="radio" name="garden" value="1" checked="checked"/> 女：<input type="radio" name="garden" value="2"/> <br /> <p>爱好</p> 篮球：<input type="checkbox" name="favor" value="1" checked="checked"> 足球：<input type="checkbox" name="favor" value="2"> 皮球：<input type="checkbox" name="favor" value="3"> <p>技能</p> 唱歌：<input type="checkbox" name="skill" value="1"> 跳舞：<input type="checkbox" name="skill" value="2"> <p>上传文件</p> <input type="file" name="fname"> <textarea name="meno">默认值 </textarea>
<select name="city" size="10" multiple="multiple"> <option value="1">北京</option> <option value="2">上海</option> <option value="3" selected="selected">成都</option> </select> <select> <!-- 分组--> <optgroup label="河北"> <option>石家庄</option> <option>保定</option> </optgroup> </select> <input type="submit" value="提交" /> <input type="reset" value="重置" /></form>
时间： 2024-10-26 20:11:32