我的前端学习历程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"/>

例如:


总结

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

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值