当前位置:
首页
文章
前端
详情

在HTML5超文本标记语言的实现方法总结!

今天小编和大家分享有关于:“在HTML5超文本标记语言的实现方法总结!”这方面的相关内容,希望正在学习这方面的小伙伴们可以有所收获!

标记:

<!DOCTYPE html>
<html>
    <head>
        <title>我的页面</title>
        <meta charet=utf-8>
    </head>
    <body>
        我的第一个html页面
    </body>
</html>

浏览器会根据本机编码来解析html

段落(一般浏览器不换行)

分段

——段落,最后呈现的效果(如是否空行等等,由浏览器来决定)

段内分行&lt;br&gt;无结束标记

第一级标题&lt;h1&gt;&lt;/h1&gt;,可作六级标题,数字越大,字符越小(内含自动换行)

拆单词&lt;wbr&gt;&lt;/wbr&gt;,告诉浏览器此单词可分开,以保证右对齐

连续的两层标题&lt;hgroup&gt;&lt;/hgroup&gt;

<hgroup>
    <h1>我喜欢</h1>
    <h2>你啊</h2>
</hgroup>

字体样式

加粗&lt;b&gt;&lt;/b&gt;,斜体&lt;i&gt;&lt;/i&gt;,可嵌套

打字机的字体&lt;tt&gt;&lt;/tt&gt;,字缩小&lt;small&gt;&lt;/small&gt;

删除&lt;del&gt;&lt;/del&gt;加入&lt;ins&gt;&lt;ins&gt;

不被提倡的&lt;s&gt;&lt;/s&gt;效果与del类似

上标( 平方)&lt;sup&gt;&lt;/sup&gt;,下标&lt;sub&gt;&lt;/sub&gt;

高亮&lt;mark&gt;&lt;mark&gt;

短语格式

强调&lt;em&gt;&lt;/em&gt;着重&lt;strong&gt;&lt;/strong&gt;,定义&lt;dfn&gt;&lt;/dfn&gt;,代码(小段)&lt;code&gt;&lt;/code&gt;,例子代码&lt;samp&gt;&lt;/samp&gt;,用户输入&lt;kbd&gt;&lt;/kbd&gt;,变量&lt;var&gt;&lt;/var&gt;,引用&lt;cite&gt;&lt;/cite&gt;

特殊格式

地址&lt;address&gt;&lt;/address&gt;,缩进(可嵌套)&lt;blockquote&gt;&lt;/blockquote&gt;,小引用&lt;q&gt;&lt;/q&gt;,不做格式重排(可原本展示原有格式)&lt;pre&gt;&lt;/pre&gt;

属性

加入分割线&lt;hr&gt;,无结束符号,&lt;hr width=50%&gt;(width=50,占50个像素点),分割线长度占页面50%,高度size=10,align=lest 靠左,缩写&lt;abbr title="中华人民共和国"&gt;PRC&lt;/abbr&gt;

所有标记都可跟title=“”在鼠标停留后出现文字

&lt;bdo dir=rtl&gt;&lt;bdi&gt;&lt;/bdi&gt;&lt;/bdo&gt;,文字从右向左排

小于符号/大于符号:a<2——a&amp;lt;2,a>2——a&amp;gt;2,&:&amp;amp;,不可打断的空格&amp;nbsp;ü——&amp;uuml;,Ü——&amp;Uuml;

列表

形成文字前的·(形成文字前的数字,即将&lt;ul&gt;变成&lt;ol&gt;

<ul>
    <li>红茶</li>
    <li>可乐</li>
</ul>

若用&lt;ol strart=-1&gt;,则第一个项目标号-1

形成词条 方糖 方的糖,甜的

<dl>
    <dt>方糖</dt>
    <dd>方的糖,甜的</dd>
</dl>

图片

在html中被看做一个字符,从左往右与字符一起排&lt;img src="mama.jpg(可加其他网站的网址)" width="200" alt="mama"(放在图片底层,以免加载不出)/&gt;,传统上属性的值加引号,gif,jpg,png其他格式不一定可在浏览器看,加入网页&lt;iframe src="http://....com"&gt;&lt;iframe&gt;,可加width hight属性

链接

1.&lt;a href="http: "(协议非常重要,要是没有会找当前目录下)&gt;网易新闻&lt;/a&gt;,在文字“网易新闻上”加超链接

2.导航至该网页里的某一段落:在某一段落的&lt;p&gt;中写上&lt;p&gt;(h1,h2也可以用),用超链接&lt;a href="you.html #haha"&gt;前往you网页的位置&lt;/a&gt;

若有&lt;a href="http://news.163.com" target=-blank(建立新的空白页面)&gt;网易新闻&lt;/a&gt;

在图形上建立超链接:

<img src="" width=100 hight=100 usemap="#map" />
<map name="map">
    <area shape="ract" coords="0,0(坐标),50,50(长宽)" href="http..." alt="news" />
  <area shape="circle" coords="75,75,25(半径)" href="http..." alt="news" />  
</map>

表格

&lt;table&gt;&lt;/table&gt;,大表格有:

<thead>
<tbody>
<tfoot>
</tfoot>
</tbody>
</thead>

&lt;table&gt;:此时无格子线&lt;table border="1"&gt;:此时有格子线

<tr>表格的一行
    <td>ios</td>一行中的一格
    <td>yes</td>
    <td>yes</td>
</tr>

<thead>
    <tr>
        <th>OS</th>
        <th>Chinese</th>
        <th>French</th>
    </tr>
</thead>

`表格`

列宽会根据表格自动调整

那么以上及就是有关于:“在HTML5超文本标记语言的实现方法总结!”这方面的全部内容,更多有关于html5这方面的相关内容我们都可以在W3Cschool中进行学习和了解!


免责申明:本站发布的内容(图片、视频和文字)以转载和分享为主,文章观点不代表本站立场,如涉及侵权请联系站长邮箱:xbc-online@qq.com进行反馈,一经查实,将立刻删除涉嫌侵权内容。