HTML学习之旅第二期(新人勿喷)

今天是我第二天分享我今天的学习之旅

1.今天是我学html的第二天,今天我学习了vscode的使用方法以及在vscode中如何快捷的使用复制(Ctrl+C)粘贴(Ctrl+V)剪切(Ctrl+X)的快捷方式以及查找(Ctrl+F)、替换(Ctrl+H)和保存(Ctrl+S)的快捷键。

2.一个新建的网页是通过代码组成的,而代码的组成是通过许许多多得到标签组成的。标签分为单标签和双标签。单标签:是由一个单词或者字母组成的。双标签:是成对出现的有开始标签<字母或单词>,结束标签</字母或单词>,切记结束标签中一定要添加/否则就不会停止标签所有的效果。

3.HTML的结构

如图所示,html标签在最外围包裹住head标签和body标签,html相当于head和body的父亲,在语言体系中属于父子关系,而head标签和body标签是在同级,在语言体系中属于兄弟关系或者叫同级关系。

4.注释

注释是为了方便其他人能够理解代码并对代码进行解释说明的用途,那么如何写注释,当注释包裹住内容的时候在执行代码时,被注释的代码不会被执行操作也不会显示在页面中,注释的快捷键是Ctrl+/(注意:/一定要是英文状态下的否则不会生效)。

5.快速生成网页架构

快速生成网页架构的快捷键是英文状态下!,注意:一定是英文状态下的感叹号,如图所示生成快速网页结构后原先的html变成了!DOCTYPE html doctype意思是声明文档的类型所以就很好理解了这句话是用来声明文档的类型是html,下面那个是语言是英语,头部里面有三个标签,第一个标签是设置字符集为中文,执行代码过程中网页中的汉字出现乱码,第二个是针对手机端的内容显示其倍数,第三个tietle是网页中的标题。

6.内容中的标题标签

h1-h6都是标题标签,在我们浏览网页中的新闻是页面第一行的标题是字体颜色比文章中的文字还要黑,字体比其还要大这就是标题标签了,标题标签是独占一行的,上下之间有边距。

这是执行后的结果h1标签是最大的最小的h6,字体的颜色和大小是逐级下降的,在使用时一定要分清。h1-h6标签也是双标签,一定要记住结束时的结尾标签要添加/

7.段落标签

段落标签就是一段文字所使用的标签常见的有p标签 ,p标签与前面提到的标题标签一样是有独占一行和上下之间有间距的特点,p标签不能和标题标签一样控制文字大小与粗细。

如图所示就是段落标签所展示的效果。<p></p>p标签是一个双标签一定要切记结束时要添加/

8.水平线标签

水平线标签就是属于一个分界线是一条线,用于分割内容和标题之间的距离。水平线标签是<hr>是一个单标签。

9.文本格式化标签

b标签用于加粗内容strong同理,而下划线是u标签和ins标签,倾斜标签是i标签和em标签,删除线是s标签和del标签与下划线不同,删除线是在文字中间有一条线。在段落中这些标签与写的文字相辅相成。一定要切记单双标签之间的区别,博主就犯过这样的错误。

10.图片标签

这是今天所学的最后一个标签图片标签,用于将图片链接进网页中显示,图片标签也是一个单标签写法是<img src=""alt="">图片标签中的sr是用于链接图片的路径,将需要的图片通过其路径在页面中显示。

这是代码和执行的结果。

这是今天博主一天的所学,希望能够对和博主一样小白的有所帮助,如果博主的措辞有问题或者哪部分没解释清楚的话可以联系我,最后再次希望大佬勿喷

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值