回顾html的常用标签及其属性

最新推荐文章于 2024-07-25 09:11:11 发布

yin_991

最新推荐文章于 2024-07-25 09:11:11 发布

阅读量1.1k

点赞数

文章标签： html

本文链接：https://blog.csdn.net/yin_991/article/details/78335056

版权

1.三个常用元素：p、h、br

2.常用的文本元素

B元素：作用是加粗文字
Br元素：强制换行
I元素：文字倾斜
del元素：删除文字
strong元素：强调一段文字，作用加粗文字、
wbr元素：安全换行
em作用是强调，也是让文字倾斜
s元素：实际作用删除，表示不准确删除
u元素：实际作用为文字加下划线
ins元素：实际作用是给文字加下划线，从语义上看是添加一段文字，起到强调作用
small元素：添加小号字体，语义上是免责声明和澄清声明
sub和sup元素：添加下标上标
dfn元素：定义术语，对一个词或短语的解释，实际效果是文字倾斜
abbr元素：表示一段文本的缩写，在文本显示上没任何效果
q元素：引用来自其他地方的内容，实际作用是加双引号
code元素：计算机代码片段
var用来表示编程语言的变量
samp元素表示程序或计算机的输出
kbd元素表示某部分内容是由客户利用键盘输入
ruby元素：表示位于文字上方或右方的注音符号
cite元素：表示引用其他作品的标题，实际效果是加粗文本
bdo元素：设置文字方向，必须使用dir属性才可以设置，共两个值，rtl（从右到左）；ltr（从左到右）【默认值】，
mark元素：突出显示文本，用于记号，实际作用加一个黄色背景
time元素：日期和时间

span元素：一般性文本，没特殊效果

代码及实现效果如下：

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>html常用元素</title>
	<style>
		body{
			background-color: #F0F8FF;
		}
	</style>
</head>
<body>
1.三个常用元素：p、h、br <br>
<p>p元素：这是一个段落</p>
<h3>h元素：这个是标题</h3>
br元素：这一行后自动换行<br>
2.常用的文本元素 <br>
<!-- B元素：作用是加粗文字 -->
	<b>b元素：加粗文字</b><br>
<!-- Br元素：强制换行 -->
	强制换行<br/><br>
<!-- I元素：文字倾斜 -->
	<i>i元素：文字倾斜</i><br>
<!-- del元素：删除文字 -->
	<del>del元素：删除文字</del><br>
<!-- strong元素：强调一段文字，作用加粗文字、 -->
	<strong>strong元素：加粗文字</strong><br>
<!-- wbr元素：安全换行 -->
	wbr元素：<br>
	这行文字很长，在缩小浏览器窗口比例的时候，换行并不是所有都换，而是在加了标签wbr的那里换yyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyy <wbr/>yyyyyyyyyyyyyy <br>
<!-- em作用是强调，也是让文字倾斜 -->
<em>em元素：强调，让文字倾斜</em><br>
<!-- s元素：实际作用删除，表示不准确删除 -->
<s>s不准确元素：不准确删除</s><br>
u元素：实际作用为文字加下划线
<u>u元素：为文字加下划线</u><br>
<!-- ins元素：实际作用是给文字加下划线，从语义上看是添加一段文字，起到强调作用 -->
<ins>ins元素：为文字加下划线，语义是加一段文字</ins><br>
<!-- small元素：添加小号字体，语义上是免责声明和澄清声明 -->
<small>small元素：添加小号字体</small><br>
<!-- sub和sup元素：添加下标上标 -->
上标、下标元素：<br>
m<sup>2</sup>  H<sub>2</sub>O <br>
<!-- dfn元素：定义术语，对一个词或短语的解释，实际效果是文字倾斜 -->
<dfn>dfn元素：对一个词或短语解释，实际效果是文字倾斜</dfn> <br>
<!-- abbr元素：表示一段文本的缩写，在文本显示上没任何效果 -->
表示一段文本的缩写，比如世贸组织<abbr>WTO</abbr> <br>
<!-- q元素：引用来自其他地方的内容，实际作用是加双引号 -->
引用来自其他地方的内容<q>q元素：加双引号</q><br>
<!-- code元素：计算机代码片段 
var用来表示编程语言的变量
samp元素表示程序或计算机的输出
kbd元素表示某部分内容是由客户利用键盘输入 -->
<!-- ruby元素：表示位于文字上方或右方的注音符号 -->
<ruby>语言<rt>(yu) (yan)</rt></ruby><br>
<!-- cite元素：表示引用其他作品的标题，实际效果是加粗文本 -->
<cite>实际效果是加粗文本</cite><br>
<!-- bdo元素：设置文字方向，必须使用dir属性才可以设置，共两个值，rtl（从右到左）；ltr（从左到右）【默认值】， -->
<bdo dir="rtl">文字方向</bdo><br>
<!-- mark元素：突出显示文本，用于记号，实际作用加一个黄色背景 -->
<mark>突出显示文本，实际效果是加一个黄色背景</mark><br>
<!-- time元素：日期和时间 -->
<time>2017-10-24</time><br>
<!-- span元素：一般性文本，没特殊效果 -->
<span>一般性文本，没效果</span>
<hr>
</body>
</html>