HTML标签可以自定义属性，但是我们要考虑其在IE、Firefox以及chrome下的兼容性问题。例如：
&div id="newTest" myAttr="getAttr"&&/div&
这里的&myAttr&就是这个标签的自定义属性了。如果定义了属性却使用不了，那么这个属性就没有任何意义了，接下来就是如何去调用我们的自定义属性的值了。在IE浏览器里，我们通过获取对象后直接调用就可以了
document.getElementById("newTest").myA
在IE浏览器里，我们同样可以对其直接赋值而动态产生一个自定义属性：
document.getElementById("newTest").newAttr = "new";
在火狐和谷歌浏览器里，我们可以通过getAttribute方法来实现调用：
document.getElementById("newTest").getAttribute("myAttr");
在火狐和谷歌浏览器里，我们可以通过setAttribute方法在产生并设置一个自定义属性：
document.getElementById("newTest").setAttribute("newAttr","new");
自定义属性一般是我们用来存储数据或是相关依据的，根据实际情况，自定义属性其实很有用的。测试浏览器：IE8，firefox 8.01，chrome 17.0.963.46 m测试结果：能够获取到自定义属性另外补充一点，如果不想做兼容判断，其实我们可以使用Jquery的attr方法来获取与设置自定义属性的值，目前测试结果是全兼容。
$("#newTest").attr("myAttr");
$("#newTest").attr("newAttr","new");
阅读(...) 评论()前端大神总结的HTML标签，真的是太全了----连载1
前端大神总结的HTML标签，真的是太全了----连载1
HTML本文，有很多很棘手的问题，例如使用sublime 编辑器可能***插件的时候会使用不了view in browser我公司的电脑可以***、结果家里的电脑就报编码错误、需要改sublime插件源代码解码成utf8就可以了、还有一直连不上packagecontrol的网页，可以群（）使劲砸我得到解决~ sublime编辑器对于前端来说确实很好用！很好用！很好用！ SublimeText、Webstorm推荐这两个编辑器HTML起源刚开始设计HTML语言是为了?文字图像关联在一起，用另一台发送或接收HTML(HyperTextMark-up Language)超文本标记语言HTML 不是一种编程语言，而是一中标记语言(mark-up language),标记语言是一套标记标签(mark-up tag)HTML标签标签是由尖括号 & & 把关键词括起来，标签通常是成对出现的Web浏览器读取 HTML 文档，使用标签来解析页面的内容，以网页的形式现实，浏览器不会现实HTML标签现在市场上主流五大浏览器每种浏览器都有自己的内核(引擎)（解析网页的一个程序，io以什么方式去渲染它都要通过引擎去执行）目前主流的浏览器分为五种Chrome谷歌浏览器 （Webkit内核，V8 js引擎）Firefox火狐浏览器 （Gecko内核）Internet Explorer IE浏览器（ Trident内核）Opera 欧朋浏览器 （Presto内核） 主要市场：移动端Safari 苹果浏览器 （Webkit内核，但JS引擎为Nitro）不需要去记，简单了解下标签使用规范标签必须闭合所有标签名一律小写代码缩进，使阅读代码更加易懂特殊符号规范使用命名规范，见名之意PS: 所有的标记符号都是半角英文编辑器众说纷纭编辑器太多，最终只是一个工具，希望同学们能从万千世界中找到适合自己的编辑器伙伴描述EditPlus手写模式，适合初学手写，无代码提示(有IE调试视图)Sublime插件特别多，占用内存小，启动速度快，打开大项目较慢，管理文件方式有些缺陷webstorm集成插件特别多，启动较慢，占用内存大，开发和管理视图都很方便Dreamweaver适合初学，主要代码提示和代码插入功能强大，主要偏向于设计(有设计视图)Sublime插件列表插件名详情请戳emmet前端自动补全，提供快捷补全方式ColorPicker调色板，颜色选择器SublimeTmplsublime模板，可以快速创建一个HTML模板view in browser用快捷方式打开浏览器进行调试HTML(需要配置参考后面网页)LiveReload实时刷新HTML(编辑器里按下保存ctrl+s的时候，已经打开的HTMl会自动刷新)谷歌插件文件***方法需要配合谷歌LiveReload插件插件文件下载Color HighlighterCSS颜色代码高亮及颜色预览提示CSS3CSS3的代码高亮提示还针对了CSS3的选择器及锚类选择器:hover :first-child :first-child ...的高亮JavaScript Completions原生js 代码提示Sublime-Better-Completion可自选开启代码提示，支持jQ、js、bootstrap、php、sql ...仓库地址此插件只能通过Github克隆下载******方法注：Github 网页中 下面是有详细的使用方法 packagecontrol.io官网 里面search 可以进行搜索插件名字来找到具体使用方法，还有什么不懂或者***出现编码错误以及***不上的可以拍打我~模板的配置配置!DOCTYPE html不是标签，主要用于文档类型的声明charset=&utf-8&声明字符编码集http-equiv=&Content-Type&把Content属性关联到HTTP头部(协议头)HTML模板简单了解，并不需要熟练掌握HTML树状结构Dom节点树HTML网页扩展名.html .htm这两种是比较常见的在早期系统中文件名是有8+3组成 三个扩展名所以不支持四个字母的扩展采用.htm现在通常使用.html作为扩展名标签的学习接下来所有的标签元素学习都在body标签里面去敲打实现、H标签为了突出标题，字体大小和加粗发生相应的改变&h1&我是大主题&/h1&&h2&我是大主题&/h2&&h3&我是大主题&/h3&&h4&我是大主题&/h4&&h5&我是大主题&/h5&&h6&我是大主题&/h6&&!doctype html&&!-- 让浏览器使用html5的标准解析 --&&html& &head& &!-- 设置字符编码集让浏览器使用utf8解析当前网页 --& &meta http-equiv=&Content-Type& content=&text/ charset=utf8& /& &meta name=&keywords& content=&SEO搜索引擎，关键词，多个请用逗号分开& /& &meta name=&description& content=&网页描述，八十字内& /& &title&浏览器标签页上的网页标题&/title& &/head& &body& &!-- 所有的标签学习都在这body里面去敲，上面head元素里面的内容做个了解就可以了 --&
&h1&我是大标题&/h1& &h2&我是主题2&/h2& &h3&我是主题3&/h3& &h4&我是主题4&/h4& &h5&我是主题5&/h5& &h6&我是主题6&/h6&
&/body&&/html&可以发现h标签从h1到h6会随着数值越小字越小，并且都是会加粗和各占一行的状态（前后的元素都会被换行）h1标签一般一个页面里面只会写一次，为了让搜索引擎爬取到 (写一次利于SEO搜索引擎优化)p段落标签&p& 冬着一身素衣，缓缓而来，季节没有了往日的姹紫嫣红，却用简单的线条，勾勒出一幅洁白的画，纯洁通透，轻盈自然。&/p&特殊符号刚我们了解到了浏览器是识别尖括号的，如果要在页面中显示html标记那要怎么做呢？这时候就需要特殊符号的表示来显示符号空格&小于&大于&引号&版权&×叉&&&加粗标签B标签物理加粗，页面呈现加粗状态.Strong标签不仅能加粗，还利于搜索引擎优化&b&物理加粗，页面呈现加粗状态.&/b&&strong&不仅能加粗，还利于搜索引擎优化，就是类似于百度、谷歌这种搜索引擎爬取你的网页的时候会查找这个标签里面的内容来优化显示网页的排名&/strong&可以根据word文档上面发现 b是加粗 u是下划线 i是倾斜 同样适用于标签&i&我是倾斜&/i& &u&我加了下划线&/u&A标签链接一个页面,点击则会跳转这个链接页面使用锚点滚动到设定的位置&a href=&&&&/a& a标签中的href控制点击的时候跳转到哪里如果没写表示刷新当前页面&a href=&#&&&/a& 跳转到当前页面(回归到页面顶部)&a href=&javascript: void(0);&&&/a& 死链接，不会跳转，一般用于js特效&a href=&#name&&锚点到一个标签上所对应的ID名字，点击则跳到那个标签位置&/a&&a href=&&&跳转到百度&/a& 跳转到百度 需要注意的是 http 协议不能少点击#flag的a标签的时候会跳到到上面h2标签只有拥有name属性的a标签才能锚点,还有一种方式是通过ID标识唯一元素，也可以跳转(不仅仅是a标签)补充标签标签滚动标签marquee字体标签font定义水平线hr属性direction滚动方向behivior行为值alternate交替滚动scroll滚动slide滑落Font标签color颜色size0-7face字体hr水平线与font相似，拥有color和size属性hr标签没有结束标签 按照早期的习惯也H5也遵循XHTML的解析 所以统一会加一个反斜杠表示结束这个标签，不加也能够正确显示，但是养成一个良好的习惯确实重要，比如微信小程序就是没有结束标签必须要使用一个反斜杠结尾否则直接报错、练习一、结合今天所学，写一个简单的网页内容如下：写一篇收获或感受 / 写一篇文章 --------& 为什么要自己写，网上一大把哈哈，可以自己写下，锻炼下思维需要包括h、p、a、加粗题材不限，至少200字练习二、在习题一的文章底部，使用滚动标签进行滚动方向为45°可以在头部找到我，如有勘误、错别字、尽情见谅很用心的检查了 码了这么久
本文仅代表作者观点，不代表百度立场。系作者授权百家号发表，未经许可不得转载。
百家号 最近更新：
简介: 每天分享关于iPhone手机的小技巧
作者最新文章