cite 表示引用到某一本书籍名称，默认样式为斜体，q 表示直接引用到里面的话，大块的引用使用block默认样式将增加“双引号” ，关键的词用<b>默认为粗体；一些技术术语则用<i>来表示，为斜体

ol标签为有序列表，在出现类似排行榜这样的信息块时，比较适合使用。可以通过<ol type="a">来指定ol列表自增symbol

  1. 第一个ol的li元素
  2. 第二个ol的li元素

dl为自定义列表，一般用来实现类似术语表这样的功能

<object><embed>来引入第三方插件，比如flash, pdf等来满足阅读pdf文档或者观看视频的需求，但是html5中就可以直接使用video,audio来完成了！

<canvas><svg>标签也是可以来嵌入资源的，其中canvas是基于像素的，svg是矢量的

<select name="groupdata" id="grouptest">

    <optgroup label="group1">

        <option value="0">0</option>

        <option value="1">1</option>

    </optgroup>

    <option value="2">2</option>

</select>

HTML中的实体标签

html的所有标签都放在<>中，浏览器在解析文档内容时，一旦遇到<>这种字符时，她都会认为是一个标签因此并不会出现在渲染内容中，但是如何能够让浏览器不把<>当作tag而当作普通的字符来处理呢？一种解决方案就是使用实体标签来表达，有点类似于转义字符

常用实体标签有：

空格： &nbsp;

"     :   &quot;

>    :   &gt;

<    :   &lt;

©    :  &copy;

&    :   &amp;

网页中所需图片分类

在一个网页中，为了美观会有很多大大小小的图片。虽然通过css3可以实现很多酷炫的图形图像效果，比如圆角，渐变等，但是对于更加复杂的效果或者考虑到浏览器兼容性的话，我们可能还是需要图片。这些图片从性质上来分，可以分为两类：

1. 修饰性的图片（一般使用background来引用）

2. 内容性的图片（一般用image标签来引用）

对于第一种往往包含小图标，logo，特殊效果的按钮文字等，以及非纯色背景等。这些图片往往从美工过来的视觉稿psd中切图来获取。

第二种往往图片本身就是网页的内容之一，比如一片文章中的配图，示意图等，广告banner等，这种图一般我们在页面设计时（形成html静态页面），只用一个image占位符来代替即可，不用从原始稿中切图。当然，如果后续这些内容图片并不会有更多版本更新，也是可以切过来的。

内容性的图片往往保存为jpg格式，因为图像信息丰富，jpg可以较好胜任；

修饰性的图片往往保存为png8或者png24(支持半透明，图片质量更高）

Attribute Name Elements Description
accept <form>, <input> List of types the server accepts, typically a file type.
accept-charset <form> List of supported charsets.
accesskey Global attribute Defines a keyboard shortcut to activate or add focus to the element.
action <form> The URI of a program that processes the information submitted via the form.
align <applet>, <caption>, <col>, <colgroup>,  <hr>, <iframe>, <img>, <table>, <tbody>,  <td>,  <tfoot> , <th>, <thead>, <tr> Specifies the horizontal alignment of the element.
alt <applet>, <area>, <img>, <input> Alternative text in case an image can't be displayed.
async <script> Indicates that the script should be executed asynchronously.
autocomplete <form>, <input> Indicates whether controls in this form can by default have their values automatically completed by the browser.
autofocus <button>, <input>, <keygen>, <select>, <textarea> The element should be automatically focused after the page loaded.
autoplay <audio>, <video> The audio or video should play as soon as possible.
autosave <input> Previous values should persist dropdowns of selectable values across page loads.
bgcolor <body>, <col>, <colgroup>, <marquee>, <table>, <tbody>, <tfoot>, <td>, <th>, <tr>

Background color of the element.

Note: This is a legacy attribute. Please use the CSS background-color property instead.
border <img>, <object>, <table>

The border width.

Note: This is a legacy attribute. Please use the CSS border property instead.
buffered <audio>, <video> Contains the time range of already buffered media.
challenge <keygen> A challenge string that is submitted along with the public key.
charset <meta>, <script> Declares the character encoding of the page or script.
checked <command>, <input> Indicates whether the element should be checked on page load.
cite <blockquote>, <del>, <ins>, <q> Contains a URI which points to the source of the quote or change.
class Global attribute Often used with CSS to style elements with common properties.
code <applet> Specifies the URL of the applet's class file to be loaded and executed.
codebase <applet> This attribute gives the absolute or relative URL of the directory where applets' .class files referenced by the code attribute are stored.
color <basefont>, <font>, <hr>

This attribute sets the text color using either a named color or a color specified in the hexadecimal #RRGGBB format.

Note: This is a legacy attribute. Please use the CSS color property instead.
cols <textarea> Defines the number of columns in a textarea.
colspan <td>, <th> The colspan attribute defines the number of columns a cell should span.
content <meta> A value associated with http-equiv or name depending on the context.
contenteditable Global attribute Indicates whether the element's content is editable.
contextmenu Global attribute Defines the ID of a <menu> element which will serve as the element's context menu.
controls <audio>, <video> Indicates whether the browser should show playback controls to the user.
coords <area> A set of values specifying the coordinates of the hot-spot region.
data <object> Specifies the URL of the resource.
data-* Global attribute Lets you attach custom attributes to an HTML element.
datetime <del>, <ins>, <time> Indicates the date and time associated with the element.
default <track> Indicates that the track should be enabled unless the user's preferences indicate something different.
defer <script> Indicates that the script should be executed after the page has been parsed.
dir Global attribute Defines the text direction. Allowed values are ltr (Left-To-Right) or rtl (Right-To-Left)
dirname <input>, <textarea>  
disabled <button>, <command>, <fieldset>, <input>, <keygen>, <optgroup>, <option>, <select>, <textarea> Indicates whether the user can interact with the element.
download <a>, <area> Indicates that the hyperlink is to be used for downloading a resource.
draggable Global attribute Defines whether the element can be dragged.
dropzone Global attribute Indicates that the element accept the dropping of content on it.
enctype <form> Defines the content type of the form date when the method is POST.
for <label>, <output> Describes elements which belongs to this one.
form <button>, <fieldset>, <input>, <keygen>, <label>, <meter>, <object>, <output>, <progress>, <select>, <textarea> Indicates the form that is the owner of the element.
formaction <input>, <button> Indicates the action of the element, overriding the action defined in the <form>.
headers <td>, <th> IDs of the <th> elements which applies to this element.
height <canvas>, <embed>, <iframe>, <img>, <input>, <object>, <video>

Specifies the height of elements listed here. For all other elements, use the CSS height property.

Note: In some instances, such as <div>, this is a legacy attribute, in which case the CSS height property should be used instead.
hidden Global attribute Prevents rendering of given element, while keeping child elements, e.g. script elements, active.
high <meter> Indicates the lower bound of the upper range.
href <a>, <area>, <base>, <link>  The URL of a linked resource.
hreflang <a>, <area>, <link> Specifies the language of the linked resource.
http-equiv <meta>  
icon <command> Specifies a picture which represents the command.
id Global attribute Often used with CSS to style a specific element. The value of this attribute must be unique.
ismap <img> Indicates that the image is part of a server-side image map.
itemprop Global attribute  
keytype <keygen> Specifies the type of key generated.
kind <track> Specifies the kind of text track.
label <track> Specifies a user-readable title of the text track.
lang Global attribute Defines the language used in the element.
language <script> Defines the script language used in the element.
list <input> Identifies a list of pre-defined options to suggest to the user.
loop <audio>, <bgsound>, <marquee>, <video> Indicates whether the media should start playing from the start when it's finished.
low <meter> Indicates the upper bound of the lower range.
manifest <html> Specifies the URL of the document's cache manifest.
max <input>, <meter>, <progress> Indicates the maximum value allowed.
maxlength <input>, <textarea> Defines the maximum number of characters allowed in the element.
media <a>, <area>, <link>, <source>, <style> Specifies a hint of the media for which the linked resource was designed.
method <form> Defines which HTTP method to use when submitting the form. Can be GET (default) or POST.
min <input>, <meter> Indicates the minimum value allowed.
multiple <input>, <select> Indicates whether multiple values can be entered in an input of the type email or file.
name <button>, <form>, <fieldset>, <iframe>, <input>, <keygen>, <object>, <output>, <select>, <textarea>, <map>, <meta>, <param> Name of the element. For example used by the server to identify the fields in form submits.
novalidate <form> This attribute indicates that the form shouldn't be validated when submitted.
open <details> Indicates whether the details will be shown on page load.
optimum <meter> Indicates the optimal numeric value.
pattern <input> Defines a regular expression which the element's value will be validated against.
ping <a>, <area>  
placeholder <input>, <textarea> Provides a hint to the user of what can be entered in the field.
poster <video> A URL indicating a poster frame to show until the user plays or seeks.
preload <audio>, <video> Indicates whether the whole resource, parts of it or nothing should be preloaded.
radiogroup <command>  
readonly <input>, <textarea> Indicates whether the element can be edited.
rel <a>, <area>, <link> Specifies the relationship of the target object to the link object.
required <input>, <select>, <textarea> Indicates whether this element is required to fill out or not.
reversed <ol> Indicates whether the list should be displayed in a descending order instead of a ascending.
rows <textarea> Defines the number of rows in a text area.
rowspan <td>, <th> Defines the number of rows a table cell should span over.
sandbox <iframe>  
scope <th>  
scoped <style>  
seamless <iframe>  
selected <option> Defines a value which will be selected on page load.
shape <a>, <area>  
size <input>, <select> Defines the width of the element (in pixels). If the element's type attribute is text or password then it's the number of characters.
sizes <link>, <img>, <source>  
span <col>, <colgroup>  
spellcheck Global attribute Indicates whether spell checking is allowed for the element.
src <audio>, <embed>, <iframe>, <img>, <input>, <script>, <source>, <track>, <video> The URL of the embeddable content.
srcdoc <iframe>  
srclang <track>  
srcset <img>  
start <ol> Defines the first number if other than 1.
step <input>  
style Global attribute Defines CSS styles which will override styles previously set.
summary <table>  
tabindex Global attribute Overrides the browser's default tab order and follows the one specified instead.
target <a>, <area>, <base>, <form>  
title Global attribute Text to be displayed in a tooltip when hovering over the element.
type <button>, <input>, <command>, <embed>, <object>, <script>, <source>, <style>, <menu> Defines the type of the element.
usemap <img>,  <input>, <object>  
value <button>, <option>, <input>, <li>, <meter>, <progress>, <param> Defines a default value which will be displayed in the element on page load.
width <canvas>, <embed>, <iframe>, <img>, <input>,

https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes

<object>, <video>

For the elements listed here, this establishes the element's width.

Note: For all other instances, such as <div>, this is a legacy attribute, in which case the CSS width property should be used instead.
wrap <textarea> Indicates whether the text should be wrapped.

大多数元素的属性都有两个面孔：content attribute以及IDL attribute

content attribute是当你从content(html代码）中直接设置时的属性(比如<img src="xxx.img"/>中的src属性)，而你可以通过element.setAttribute()或者element.getAttribute()函数来set和get的属性。

content属性通常总是一个string，即使当预期的值应该是一个integer的情况下。比如，为了使用content attribute来设置一个<input>元素的maxlength为42时，你就调用setAttribute(“maxlength","42")在那个元素上。

IDL属性则被公认为是一个javascript的属性。这些属性你可以使用javascript属性（类似于element.foo)来读或写。IDL attribute总会使用（但是有可能变形）underlying content attribute来返回一个value（当你get it时），会在content attribute中保存一些属性当你set it。换句话说，IDL attribute，基本上就是用来反映conent attribute的。

大多数时候，IDL attribute会返回返回他们实际使用的values.比如，默认的<input>元素的type是"text",所以如果你通过input.type="foobar"来设置type,则<input>袁术将会在appearance和behaviour上是text type，而"type" content attribute的value将会被设置为"foobar".然而type的IDL attribute将会返回"text"

IDL attribute并不总是string,比如，input.maxlength是一个数值型(signed long)。当使用IDL attribute,你读或写desired type, 那么input.maxlength总厂会返回一个number，当set input.maxlength时，则它需要一个number参数。如果你传入其他类型，则她会自动转换为一个number

html tags and attribute集参考的更多相关文章

  1. Mongodb Manual阅读笔记：CH8 复制集

    8 复制 Mongodb Manual阅读笔记:CH2 Mongodb CRUD 操作Mongodb Manual阅读笔记:CH3 数据模型(Data Models)Mongodb Manual阅读笔 ...

  2. [个人翻译]Redis 集群教程（上）

    官方原文地址:https://redis.io/topics/cluster-tutorial  水平有限,如果您在阅读过程中发现有翻译的不合理的地方,请留言,我会尽快修改,谢谢.        这是 ...

  3. 搭建高可用mongodb集群（四）—— 分片（经典）

    转自:http://www.lanceyan.com/tech/arch/mongodb_shard1.html 按照上一节中<搭建高可用mongodb集群(三)-- 深入副本集>搭建后还 ...

  4. [转]搭建高可用mongodb集群（四）—— 分片

    按照上一节中<搭建高可用mongodb集群(三)—— 深入副本集>搭建后还有两个问题没有解决: 从节点每个上面的数据都是对数据库全量拷贝,从节点压力会不会过大? 数据压力大到机器支撑不了的 ...

  5. 搭建高可用mongodb集群（四）—— 分片

    按照上一节中<搭建高可用mongodb集群(三)—— 深入副本集>搭建后还有两个问题没有解决: 从节点每个上面的数据都是对数据库全量拷贝,从节点压力会不会过大? 数据压力大到机器支撑不了的 ...

  6. 搭建高可用mongodb集群（四）—— 分片

    按照上一节中<搭建高可用mongodb集群(三)-- 深入副本集>搭建后还有两个问题没有解决: 从节点每个上面的数据都是对数据库全量拷贝,从节点压力会不会过大? 数据压力大到机器支撑不了的 ...

  7. [CLR via C#]18. Attribute

    attribute可以说是Microsoft .NET Framework提出的最具创意的技术之一了.利用attribute,可以声明性的为自己的代码构造添加注解,从而实现一些特殊的功能.attrib ...

  8. Codevs 2597 团伙(并查集)

    2597 团伙 时间限制: 1 s 空间限制: 128000 KB 题目等级 : 黄金 Gold 传送门 题目描述 Description 1920年的芝加哥,出现了一群强盗.如果两个强盗遇上了,那么 ...

  9. 搭建高可用mongodb集群—— 分片

    从节点每个上面的数据都是对数据库全量拷贝,从节点压力会不会过大? 数据压力大到机器支撑不了的时候能否做到自动扩展? 在系统早期,数据量还小的时候不会引起太大的问题,但是随着数据量持续增多,后续迟早会出 ...

随机推荐

  1. ios模拟器安装测试包方法

    1. 使用ios-sim ios-sim是一个可以用命令空着ios模拟器的工具.利用这个命令,我们可以启动模拟器.安装app.启动app.查询ios sdk,它可以使我们像自动化测试一样打开xcode ...

  2. (转)【面试】【MySQL常见问题总结】【03】

    [常见面试问题总结目录>>>] [面试][MySQL常见问题总结][03] 2016-05-29 22:20 阅读(8244) 评论(2) [面试][MySQL常见问题总结][02] ...

  3. spark跑YARN模式或Client模式提交任务不成功（application state: ACCEPTED）

    不多说,直接上干货! 问题详情 电脑8G,目前搭建3节点的spark集群,采用YARN模式. master分配2G,slave1分配1G,slave2分配1G.(在安装虚拟机时) export SPA ...

  4. 关于require js加载的时候报错的问题

    1.在项目中使用了requery.js  页面总是会出项一些奇怪的错误,如下 后来经过查找资料才发现,原来是因为依赖 的问题,因为require加载的时候是异步加载,而js之间是有相互依赖的,所以解决 ...

  5. Clojure 开发环境 light table 和 Leiningen 安装指引

    1 首先下载 Light table 然后 解压到到一文件夹.目录中千万不能有空格 下载地址 http://www.lighttable.com/ 2下载构建工具 下载地址 http://leinin ...

  6. 游戏中的网络同步机制——Lockstep（帧同步）

    本文来自: https://bindog.github.io/blog/2015/03/10/synchronization-in-multiplayer-networked-game-lockste ...

  7. 用.net 2.0(或.net 3.5)开发的程序在.net 4.0的环境中运行的解决方案

    引用:.NET2.0程序集无法在.net 4.0 中运行的解决方案 1. 原来是在.net 2.0 (VS2008)的环境下的程序,通过升级到.net 4.0 (VS2013)导致程序运行不了 提示需 ...

  8. rem单位怎么使用

    rem这是个低调的css单位,近一两年开始崭露头角,有许多同学对rem的评价不一,有的在尝试使用,有的在使用过程中遇到坑就弃用了.但是我对rem综合评价是用来做web app它绝对是最合适的人选之一. ...

  9. 开启停止wifi热点bat脚本

    @echo offcolor 2title    启停无线WIFI echo                            启动WIFI=======>按1键   echo        ...

  10. Dell解决黑苹果网卡（BCM94352ZAE/DW1560）怎么都打不开WiFi

    Dell解决黑苹果网卡(BCM94352ZAE/DW1560)怎么都打不开WiFi 2017年10月20日17:41:00 by SemiconductorKING 本来觉得驱动这个网卡不是个问题,以 ...