html常用标签大全?html代码生成图片
其实html常用标签大全的问题并不复杂,但是又很多的朋友都不太了解html代码生成图片,因此呢,今天小编就来为大家分享html常用标签大全的一些知识,希望可以帮助到大家,下面我们一起来看看这个问题的分析吧!
html常用标签有哪些
html常用标签
最近,对html的重温,对一些常用的html标签进行了整理,给大家分享一下。
html结构:
<html> html开始标签
<head>
<title>html文档标题</title>
</head>
<body>
html文档内容....
</body>
</html> html结束标签
html常用标签:
表格:
<table>表格开始标签
<tr>行
<td></td>列
</tr>
</table>表格结束标签
表格属性:<table width="" height="" border="" bgcolor="" background="" cellpadding="' cellspacing="">其中: width:为表格的宽度,height:表格的高度,border:表格的边框,
bgcolor表格的背景颜色,background表格背景颜色。cellpadding:表格字间距, cellspacing:表格边框间距。
双标签:
<b></b>字体加粗
<i></i>斜体
<u></u>字体下划线
<s></s>删除线
<strike></strike>删除线
单标签:
<br/>换行
<hr/>水平线
空格:
向右双箭头:»
注册商标符:®
版权符号:©
双引号:"
链接
<a rel="external nofollow" href="#" title="">链接文本/图片</a>
注:#换成所要链接的文件相对地址。title:为链接提示信息。
图片链接:
<img src="" alt="" width="" hegiht="">
src:图片链接相对地址,alt:图片信息, width:图片宽度,height:图片高度。
表单:
表单开始标签:<form name="表单名称" method="post/get" action="提交地址">
文本框:<input type="text" name="名称" value="值"/>
密码框:<input type="password" name="名称" value="值"/>
单选按钮:<input type="radio" name="名称" checked/>
复选框:<input type="checkbox" name="名称" checked/>
列表:
<select>
<option value="值"></option>
</select>
文本区域:<textarea cols="文本的宽度" rows="文本行数"></textarea>
提交按钮:<input type="submit" name="名称" value="值"/>
重置按钮<input type="reset" name="名称" value="值"/>
表单结束标签:</form>
常用的HTML文本标签有哪些
<!--...-->定义注释;<!DOCTYPE>定义文档类型;<a>定义锚;<abbr>定义缩写;<acronym>定义只取首字母的缩写;<address>定义文档作者或拥有者的联系信息。
<applet>不赞成使用,定义嵌入的applet;<area>定义图像映射内部的区域;<article>定义文章;<aside>定义页面内容之外的内容;<audio>定义声音内容;<b>定义粗体字。
<base>定义页面中所有链接的默认地址或默认目标;<basefont>不赞成使用。定义页面中文本的默认字体、颜色或尺寸;<bdi>定义文本的文本方向,使其脱离其周围文本的方向设置。
扩展资料
HTML特点如下:
1、简易性:超级文本标记语言版本升级采用超集方式,从而更加灵活方便。
2、可扩展性:超级文本标记语言的广泛应用带来了加强功能,增加标识符等要求,超级文本标记语言采取子类元素的方式,为系统扩展带来保证。
3、平台无关性:虽然个人计算机大行其道,但使用MAC等其他机器的大有人在,超级文本标记语言可以使用在广泛的平台上,这也是万维网(WWW)盛行的另一个原因。
4、通用性:另外,HTML是网络的通用语言,一种简单、通用的全置标记语言。它允许网页制作人建立文本与图片相结合的复杂页面,这些页面可以被网上任何其他人浏览到,无论使用的是什么类型的电脑或浏览器。
参考资料来源:百度百科-HTML
参考资料来源:百度百科-html标签
介绍几个常用的HTML5标签
一、Html的基本结构:
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8">
<title></title>
</head>
<body>
网页的文本、图片等信息;
</body>
</html>
二、Head部分:用于表示网页的元数据即描述网页的基本信息
其常用标签及属性有:
1、title标签:浏览器标签页显示的标题
2、meta标签:其常用属性
①charset:设置文档的字符集编码格式。HTML5中设置字符集编码:<meta charset="UTF-8">
常见的字符集编码格式:
a.GB-2312:国标码,简体中文
b.GBK:扩展的国标码
c.UTF-8:万国码 Unicode常用
②http-equiv属性:将我们的信息写给浏览器看,让浏览器按照这里面的要求执行,可选属性值:Content-Type(文档类型)refresh(网页定时刷新)set-cookie(设置浏览器cookie缓存)需要配合content属性使用。(http-equiv属性只是表明需要设置哪一部分,具体的设置内容,放到content属性中)
③name属性:使用方法同“http-equiv”。将我们的信息写给搜索引擎看
常用且需要掌握的属性值:author(作者)keywords(网页关键字)description(网页描述)这两个属性设置,网页必不可少。
3、link标签:链接网页图标(title前的小logo),其常用属性有:
①rel属性:声明链接文件的类型,此处选icon
②type属性:可以省略
③href属性:表示图片的路径地址
三、body部分:网页的文本、图片等信息
标签的分类:
块级标签:显示为块,前后隔一行(自动换行)
行级标签:按行从左往右逐一显示。
1、常见的块级标签:
①<h1></h1>......<h6><h6>:标题标签,自动加粗,h1最大,h6最小。
②<hr/>:水平线标签,添加一条水平线。
③<p></p>:段落标签,
④<br/>:换行标签,
⑤<blockquote/></blockquote>:引用标签,cite属性,表明引用的来源,一般引用网址
浏览器默认首行缩进。
⑥<pre></pre>:预格式标签,用于重载代码。浏览器默认显示样式:1、显示为等宽字体。 2、代码中的换行、
空格等元素能在浏览器中显示。
【补充】html文件中空格的表示:
2、基于布局的块级标签
列表:无序列表、有序列表、定义列表
①有序列表:<ol></ol>列表项:<li></li>
②无序列表:<ul></ul>列表项:<li></li>
③定义列表(实现图文混排):<dl></dl>
列表<dt>一般只有一项</dt>
列表描述项:<dd>可以有很多项</dd>
3、组合标签:<figure></figure>用于显示图片及图片标题
他有两个子标签:<img/>图片
<figcaption></figcaption>图片的标题
例如:<figure>
<img src="img/EZ.jpg" height="20%" width="20%" alt="探险家"/>
<figcaption>探险家伊泽瑞尔</figcaption>
</figure>
4、分区标签:<div></div>
5、常见的行级标签
<1>span(文本):无实际意义,用于包裹某部分文字,修改特定样式,例如:
这是<span style="color: red;font-size: 36px;">span</span>中的文字
img(图片):其常用属性:①src:表示引用图片的地址。
路径地址的写法:相对路径:以当前文件为最准,去寻找图片地址
a、与文件处于同一层的图片,直接写图片名
b、图片在当前文件下一层:文件名/图片名
c、图片在当前文件上一层:../图片名
绝对路径:file:///盘符:/文件夹/图片名,但是严禁使用
图片网址:网络上的图片链接,但是一般不用
②height和width:图片的高度和宽度。可以用CSS样式代替
③title:图片标。当鼠标指上之后显示的文字
④alt:当图片无法显示的时候,显示的文字
<2>em(倾斜强调)
<3>strong(加粗强调)
<4>b(加粗)
<5>i(倾斜)
Strong、em、b、i的区别
1、Strong、em都表示强调,Strong为粗体,em为斜体,而Strong的强调程度逗比em高
2、Strong和b都能加粗,em和i都能倾斜,,但是Strong和em多了一层强调的语义。H5要求标签尽可能实现语义化。
<6>q(短引用)
<7>small/big(缩小/放大字体):small和big分别是缩小和扩大字体,都可以多层嵌套直至上限或下限
<8>a(超链接)
1、href:超链接的路径,可以是网络链接,也可以是本地文件。
2、target:跳转页面打开的位置。_self自身页面,_blank新页面。
3、title:鼠标指在超链接上显示的名称。
4、Rel(被链接是当前的前/后一篇):指定被链接文档与当前文档的关系,搜索引擎会利用该属性获取更多的有关链接的信息:
rel="prev"被链接文档是当前文档的前一篇文档,
rel="next"被链接文档是当前文档的后一篇文档,
rel="icon"被链接文档是当前文档的图标
rel="stylesheet"被链接文档是当前文档的样式表
5、Rev(当前是被链接的前/后一篇)
锚链接:
①本页面锚链接:a、设置锚点:<a name="top"></a>
b、跳转锚点:#name名
①页面间锚链接:a、在即将跳转页面的指定位置设置锚点
b、跳转锚点:页面地址.html#name名
<a rel="external nofollow" href="02_常见的块级标签.html#Hbuilder">页面间锚链接</a><br/>
功能性链接: mailto用于给指定邮箱发送邮件
file:///e:/aaa.png打开本地文件
tencent://message/?uin=1315618220给指定QQ发送息
<9>s标签,有误文本:删除线
<s>这是S标签中的文字</s><br/>
<10>cite标签:浏览器显示为倾斜,常用于书、画作、作品的引用
<cite>这是cite中的文本</cite><br/>
<11>code:计算机代码,不保留代码格式
<pre>
<code></code>
</pre>
<12>bdo:表示文本方向,属性:dir="ltr"表示从左往右,dir="rtl"表示从右往左
<bdo dir="rtl">1234567</bdo><br/>
kbd:表示需要用户用键盘输入的内容,浏览器显示为等宽字体
请输入“<kbd>Esc</kbd>”推迟系统<br/>
<13>sup:上标文本,sub:下标文本
x<sub>6</sub><br/>
©©空格
©©空格 <br/>
<14>u:下划线
<u>这是下划线</u><br/>
mark:高亮或标记文本,浏览器显示为黄色背景
<mark>mark</mark><br/>
关于html常用标签大全,html代码生成图片的介绍到此结束,希望对大家有所帮助。