HTML5文本标签有哪些,怎样使用及控制呢?
Admin 2022-11-30 群英技术资讯 354 次浏览
设计Web页面时要组织好页面的基本元素,同时再配合一些特效,构成一个绚丽多彩的页面。页面的组成对象包括文本、图片、表单、超链接以及多媒体等。内容是网站的灵魂,而文本则是构成网站灵魂的物质基础。文本与图片在网站上的运用是最广泛的,一个内容充实的网站必然会用大量的文本和图片,然后把超级链接应用到文本和图片上,才能使这些文本和图片“活”起来。
标题段落在页面文字中起到格式化文本的作用,可以使得文本信息结构更清晰,读者可以一目了然。
<hi>标签用于定义段落标题的大小级数。
<hi>标题</hi>
其中i表示标题级数,取值范围为1到6之间的正整数。最大的标题级数是<h1>,最小的标题级数是<h6>。
可使用<hi>标签的align
属性来控制文字的对齐方式,属性值可以是left
(左看齐)、center
(居中对齐)、right
(右对齐)和justify
(两端对齐,对齐进行伸展,这样每行都可以有相等的长度),默认的属性值为left。
<!DOCTYPE html>
<html>
<head>
<title>各级标题</title>
</head>
<body>
<h1>这是第一级标题</h1>
<h2>这是第二级标题</h2>
<h3>这是第三级标题</h3>
<h4>这是第四级标题</h4>
<h5>这是第五级标题</h5>
<h6>这是第六级标题</h6>
</body>
</html>
<p>标签用于划分段落,控制文本的位置。
<p>段落内容</p>
<p>是成对标签,用于定义内容从新的一行开始,并与上段之间有一个空行。开始标签<p>和结束标签</p>之间写入段落内容。
可使用<p>标签的algin属性定义新开始的一行的内容在页面中的对齐位置,属性值可以是left
(左对齐)、center
(居中对齐)、right
(右对齐)和justify
(两段对齐,对行进行伸展,这样每行都可以有相等的长度)。<p>标签的align属性不建议使用,可以利用CSS来代替。
<!DOCTYPE html>
<html>
<head>
<title>段落标签</title>
</head>
<body>
<p align="left"> HTML5 的时代已经到来,各大浏览器早已做好准备,能很好的支持 HTML5 规范。
当前互联网技术飞速发展,但几乎每一个互联网产品,都无法回避前端开发这一环节</p>
<p align="center"> HTML5 的时代已经到来,各大浏览器早已做好准备,能很好的支持 HTML5 规范。
当前互联网技术飞速发展,但几乎每一个互联网产品,都无法回避前端开发这一环节</p>
<p align="right"> HTML5 的时代已经到来,各大浏览器早已做好准备,能很好的支持 HTML5 规范。
当前互联网技术飞速发展,但几乎每一个互联网产品,都无法回避前端开发这一环节</p>
<p align="justify"> HTML5 的时代已经到来,各大浏览器早已做好准备,能很好的支持 HTML5 规范。
当前互联网技术飞速发展,但几乎每一个互联网产品,都无法回避前端开发这一环节</p>
</body>
</html>
<br>标签用于定义文本从新的一行显示。
<br>
它不产生一个空行,但连续多个的<br>标签可以产生多个空行的效果。
<br>标签是非成对标签,所以规范的换行标签在使用的时候记为<br>。
注意:<br>标签只是简单地开始新的一行,而当浏览器遇到<p>标签时,通常会在相邻的段落之间插入一些垂直的间距。
<!DOCTYPE html>
<html>
<head>
<title>换行标签</title>
</head>
<body>
<p> HTML5 的时代已经到来,各大浏览器早已做好准备,能很好的支持 HTML5 规范。
当前互联网技术飞速发展,但几乎每一个互联网产品,都无法回避前端开发这一环节</p>
<p> HTML5 的时代已经到来,各大浏览器早已做好准备,能很好的支持 HTML5 规范。<br>
当前互联网技术飞速发展,但几乎每一个互联网产品,都无法回避前端开发这一环节</p>
</body>
</html>
注意:注意观察<br>标签与<p>标签的区别,特别是行间距
<hr>标签用于产生一条水平的线,以分隔文档的不同部分。
<hr>
<hr>标签是非成对标签,所以规范的换行标签在使用的时候记为<hr>
<!DOCTYPE html>
<html>
<head>
<title>水平标签</title>
</head>
<body>
<h1>前言</h1>
<hr>
<p> HTML5 的时代已经到来,各大浏览器早已做好准备,能很好的支持 HTML5 规范。<br>
当前互联网技术飞速发展,但几乎每一个互联网产品,都无法回避前端开发这一环节</p>
</body>
</html>
字形标签用于设置文字的风格。
HMTL规范声明:
<div>标签可以用来排版大块的HTML段落,设置多个段落的文本对齐方式等。
<div></div>
目前<div>
标签最重要的功能是结合CSS设计页面布局。<div>标签是一种块(block)容器,默认状态时占据一行。
<div style="color:#0000FF">
<h3>这是一个在div元素中的标题</h3>
<p>这是一个在div元素中的文本</p>
</div>
<span>
标签被用来组合文档中的行内元素。使用方法和<div>标签基本相同。
<span>行内容</span>
<span>标签没有固定的格式表现。当对他应用样式时,才会产生视觉上的变化。如果不对<span>应用样式,那么span元素中的文本与其他文本不会有任何视觉上的差异。可以通过CSS对它定义样式,也可以通过JavaScript对它进行操作。
<span>标签和<div>标签主要区别为:
在HTML中:
免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:mmqy2019@163.com进行举报,并提供相关证据,查实之后,将立刻删除涉嫌侵权内容。
猜你喜欢
这篇文章主要介绍了关于解决iframe标签嵌套问题的解决方法,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
这篇文章主要介绍了浅析HTML5 meta viewport参数的相关资料,帮助大家更好的理解和学习HTML5,感兴趣的朋友可以了解下
因为在现在的大部分项目中很多都用到了滚动条,有时候用到模拟的滚动条,现在说下滚动条的CSS也能解决。比如网易邮箱的滚动条样子很好看,就是利用的CSS来设置的,而且是webkit浏览
css怎么实现半圆?半圆半圆分为:上半圆、下半圆、左半圆、右半圆,我们只要学会制作某一个方向的半圆,其他方向的半圆都可以轻松实现,其原理都一样。假如我们要制作上半圆,实现原理:
本章给大家介绍html5如何利用canvas实现图片转素描效果。有一定的参考价值,有需要的朋友可以参考一下,希望对你们有所帮助。
成为群英会员,开启智能安全云计算之旅
立即注册Copyright © QY Network Company Ltd. All Rights Reserved. 2003-2020 群英 版权所有
增值电信经营许可证 : B1.B2-20140078 粤ICP备09006778号 域名注册商资质 粤 D3.1-20240008