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. Partition Array by Odd and Even

    Partition an integers array into odd number first and even number second. Example Given [, , , ], , ...

  2. cmake 简学

    https://www.cnblogs.com/cv-pr/p/6206921.html

  3. 关于halo博客系统的使用踩坑——忘记登录密码

    踩坑: halo系统可以直接通过运行jar -jar halo-0.0.3.jar跑起来,也可以通过导入IDE然后运行Application的main方法跑起系统. h2数据库访问路径:http:// ...

  4. openerp学习笔记 对象继承,对象初始化数据

    1.对象继承     _inherit = "product.product" 继承产品对象,给产品对象添加字段或方法,不需要设置 _name._table 等属性     注意: ...

  5. Visual Studio 2013复制项目

    在当前解决方案下复制项目的步骤: 1. 在硬盘存放代码的目录下将整个文件拷贝一份,修改文件夹名字,改成新的项目名称, 然后修改 *.csproj文件,名字必须与新项目名一致. 2. 在解决方案上右键 ...

  6. 在web应用中使用文件

    使用HTML5 DOM新增的File API,现在可以让网页要求用户选择本地文件,并且读取这些文件的信息了.选择的方式既可以是HTML<input> 元素,也可以是拖拽 . 你可以在chr ...

  7. 铵钮提交事件PostBack之后,一些动态加载的物件丢失

    今早起来,发现skype有网友留言,情况大约如下,不过Insus.NET还是先感谢网友的测试.http://www.cnblogs.com/insus/p/3193619.html  如果你有看此篇博 ...

  8. .net托管资源与非托管资源

    在项目当中用到的资源分为托管资源和非托管资源,托管资源无非就是什么int.string.datatime之类,托管资源不需要人为去管理,.net framework中有专门针对托管资源的管理机制(GC ...

  9. The Internet Communications Engine (Ice) 跨平台异构通讯方案 第一弹-ICE简介

    .net中的通讯方案很多,从.net Remoting,MSMQ,Webservice,WSE,WCF等等,他们都有一个特点,易用,但是都不能跨语种异构,如果你服务端要用java开发,客户端用C#开发 ...

  10. sql server分页查询

    1.引言 在列表查询时由于数据量非常多,一次性查出来会非常慢,就算一次查出来了,也不能一次性显示给客户端,所以要把数据进行分批查询出来,每页显示一定量的数据,这就是数据要分页. 2.常用的数据分页方法 ...