ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

我的前端学习历程01HTML基本标签

2021-09-18 11:00:28  阅读:214  来源: 互联网

标签:HTML 标签 前端 html 加粗 对齐 strong 01HTML


前言

我认为学习前端要把基础打好,优秀的前端工程师一定会有一个扎实的HTML基础,这是我的学习笔记,有什么的遗漏可以帮忙补充!


提示:以下是本篇文章正文内容,下面案例可供参考

一、HTML的基本骨架

HTML学的好,基本骨架认识深刻还要早

<!DOCTYPE html>
<html lang="zh-CN">
	<head>
		<mate charset="UTF-8">
		<title></title>
	</head>
	<body>
	</body>
</html>

<!DOCTYPE html > 该标签是声明该文档为html5 版本类型,也是HTML中唯一一个大写的标签。

< html lang=“zh-CN”></html> 这是html的主体,也叫做根标签 。lang为html的语言信息,一般写成 en(英语)、zh-CN(简体中文)

< head >< /head>这是html里面的头标签

< mate charset=“UTF-8”> 该标签为单标签 chartset字符格式属性必须要设置,不然会导致乱码,常用的字符格式有 UTF-8,GBK,GB2312…一般使用(万国码)UTF-8。

< title> 标题</title> 标题标签 html的标题,和 mate 标签都写在 head 标签里面

< body></body> 主题标签,页面元素都写在body标签里面

二、常用标签

1.标题标签

标题标签为双标签,块级标签,独占一行。标题标签有6个,分别是h1~h6,h1标签最大,依次变小
写法为: <h1> 内容</h1>

h1标签

h2标签

h3标签

h4标签

h5标签
h6标签
常用属性为 align 水平对齐方式 left左对齐 center居中 right右对齐
写法:<h1 align="center"></h1>

左对齐

居中

右对齐

2.段落标签

p标签也是块级标签,双标签,
写法:<p></p>

3.div标签

div标签也叫布局标签,也是块级标签,独占一行

<div>div1</div> 
<div>div2</div>

例如:

div1 div2

4.span标签

行标签,当该行写满之后才会换行

<span>1</span><span>2</span>3<span3>

例如:12

5.字体加粗

b标签和strong标签
两个标签作用都是加粗,b标签是视觉效果上加粗了,而strong是画出重点,作用上不一样

<b>这里是b标签</b>
<strong>这里是strong标签</strong>

不加粗
这里是加粗的b标签
这里是加粗的strong标签

6.斜体

i标签和em标签
两个都是斜体,作用和字体加粗大同小异

<i>这里是斜体i</i>
<em>这里是斜体em</em>

7.删除线

s标签和del标签
两个都是删除线

<s>这是删除线s</s>
<del>这是删除线del</del>

这是删除线s
这是删除线del

8.换行符

br标签,单标签

sdufu<br/>sfbdfaudf

sdufu
sfbdfaudf

9.水平线

hr标签,单标签,用于分割文字
属性有color 颜色、width 长度(默认占一行的长度)、align 水平对齐方式(默认水平居中)、size宽度

<hr color="red" width="100px"/>

例如:


总结

要多敲,多练。好记性不如烂笔头,赶紧去敲代码吧

标签:HTML,标签,前端,html,加粗,对齐,strong,01HTML
来源: https://blog.csdn.net/doiwed/article/details/120360451

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有