1.文件结构: HTML文件的固定结构: <html> <head>...</head> <body>...</body> </html> html是根标签 head定义文档头部,包含: title, script, style, link, meta body是网页主要内容,包含:h1,h2-h6, p, a, img html标签建议使用小写。 空标签加斜杠是更长远的保障,如<br />。 语义化,标签的使用要遵循语义化。 2.文档头部 <head> <meta charset="utf-8"> 文档字符解码格式,防止乱码 <meta name="keywords" content="关键词"> 提供给搜索引擎使用 <meta name="description" content="描述"> 提供给搜索引擎使用 <meta name="viewport" content="width=device-width,initial-scale=1.0"> 移动端浏览器的宽度与缩放 <title>...</title> 文档标题 <base href="" target=""> 定义页面中所有链接默认的目标地址 <link rel="" href=""> 引入样式表css文件、favicon文件 <style></style> 样式 <script></script> js代码 <noscript></noscript> 不支持js代码时候执行 </head> 3.html属性 html元素可以设置属性。 属性位于开始标签。 属性可以为元素添加附加信息。 属性总是以名称/值对的形式出现,属性值用双引号括起来,值中有双引号的用单引号。如href="www.love.com"。 如class,id,style,title 4.body部分 <!DOCTYPE html> 文档声明 <html> <html> <head>...</head> <body> <h1>这是一个标题</h1> 最重要的标题,后面以此类推。 <h2>这是一个标题</h2> <h3>这是一个标题</h3> <h4>这是一个标题</h4> <h5>这是一个标题</h5> <h6>这是一个标题</h6> <p>这是段落</p> <a href="链接地址" target="定义链接的文档在何处显示">这是链接,可以是文本,也可以是图片</a>target可以取值_blank,_self <img src="" alt="图片无法加载时候的替代文本" width="" height="" /> 图片 <map></map>图像地图,可以设置图片哪里可以点击哪里不能点击,使用<area shape="" coords="" alt="" href=""> <hr /> 水平线 <!--这是注释--> 注释可以提高代码可读性,使代码更容易被理解,浏览器会忽视注释。 <br /> 折行 html文本标签 <b></b> 粗体文字 <i></i> 斜体文字 <em></em> 着重,表现为斜体 <strong></strong> 强调,表现为粗体 <small></small> 小号字 <sub></sub> 定义下标字 <sup></sup> 定义上标字 <ins></ins> 定义插入字 <del></del> 定义删除字 计算机输出标签 <code></code> 计算机代码 <kbd></kbd> 地址 <samp></samp> 计算机代码样本 <var></var> 变量 <pre></pre> 预格式文本,这个很重要。可以保存空格等全部格式 html引文,引用,标签定义 <abbr></abbr> 定义缩写 <address></address> 定义地址 <bdo></bdo> 定义文字方向 <q></q> 短引用 <blockquote></blockquote> 长引用 <cite></cite> 定义引用、引证等 <dfn></dfn> 定义一个定义 表格 <table border="1"> 表格 <caption></caption> 表格标题 <colgroup> 定义表格列的组 <col span="2" style="background-color:red"> 定义表格列的属性 <col style="background-color:yellow"> </colgroup> <thead> 表格页眉 <tr> 表格里的行 <th></th> 表格表头的单元格,粗体居中 <th></th> </tr> </thead> <tbody> 表格主体 <tr> <td></td> 表格里的单元格 <td></td> </tr> </tbody> <tfoot> 表格页脚 <tr> <td></td> 表格里的单元格 <td></td> </tr> </tfoot> </table>> 列表 有序列表 <ol> <li></li> <li></li> </ol> 无序列表 <ul> <li></li> <li></li> </ul> 自定义列表 <dl> <dt></dt> <dd></dd> <dt></dt> <dd></dd> <dd></dd> </dl> <div></div> 定义一块区域,块级元素 <span></span> 需要添加样式时候使用,内联元素 表单 <form> 定义表单, input定义输入域,form有method和action属性 <input type="txet" name="" value=""> 文本框 <input type="password" name=""> 密码框 <input type="radio" name="" value=""> 单选按钮,属于同一组的单选按钮name相同 <input type="checkbox" name="" value=""> 复选框,同一组按钮的name相同 <input type="submit" value=""> 提交按钮 <input type="reset" name=""> <textarea rows="" cols=""></textarea> 文本域 <select name=""> 下拉列表 <option value=""></option> 下拉列表的选项 <option value=""></option> <option value="" selected></option> selected表示默认选中 </select> </form> multiple 属性规定输入字段可选择多个值 <label></label> label标签为 input 元素定义标注(标记),可以和input一起使用 <button type="button"></button> 定义按钮,在 <button> 元素内部,可以放置文本或图像。这是该元素与使用 <input> 元素创建的按钮之间的不同之处。始终为 <button> 元素规定 type 属性。不同的浏览器对 <button> 元素的 type 属性使用不同的默认值。 框架 <iframe src="" width="" height=""></iframe> html颜色,由红绿蓝混合而成。 颜色名 red blue white black green gray 颜色十六进制 #FFFFFF 0到F 颜色RGB rgb(255,255,255) 0到255 字符实体(不要忘记分号!!!) 实体名称 显示效果 描述 实体编号 空格 < < 小于号 < > > 大于号 > & & 和号 & " " 引号 " © 版权 © ™ 商标 ™ ® 注册商标 ® × 乘号 × ÷ 除号 ÷ ¥ 日元 ¥ </body> </html> <html> <head>...</head> <body>...</body> </html>
时间: 2024-10-12 21:58:38