html学习心得

学习内容:


1.通过这两周课对web应用基础的学习,一开始,我了解到了在学习这门技术的最开始应该下载其开发软件,分别下载了webstorm和Visual Studio Code这两个软件。在下载了VScode后又下载了安装了以下插件,其中包含:Auto Close Tag、Auto Rename Tag、Code Runner、IntelliSense for CSS、Material Icon、Open HTML in Browser、Path Intelligence,open in browser,以及live sever等。同时了解到了使用google chrome和edge浏览器的好处,在运行html代码的时候,我们首选的是live server,但可能是由于电脑某些设置的缘故,导致open in live server无法直接在网页中打开(目前仍然未找到答案),但有另一种方式可以打开,就是利用网页直接输入127.0.0:5500可以有效打开在电脑中编译的html文件,同时我发现最初使用open in default browser之所以不能打开的主要原因在于open in browser的版本过高,只要将版本改为上一个版本,则可以直接在网页中运行。


2.在之后我们学习了html文档的格式,了解到了html文档整个 HTML 就由一个个元素组成(可以嵌套),而元素则一般由一对标签(tag)构成,其中元素包含了开始标签,结束标签以及其中的内容,把html文档打开来看,主要有html元素,head元素,设置文档使用utf-8字符集编码元素, 指定页面的图标的元素,设置页面标题元素等。
3.而后在对html文档的进一步学习中,我们了解到了跟c++一样,在html中同样存在注释语言,使用ctrl+/即可快速对行程序进行注释,元素可以进行嵌套处理,一个网址最重要的当然是标题,html对于文档标题提供了从大到小的六级标题,对于超链接而言,我们使用的格式通常为a href=具体链接+该网址名称,锚点即为书签,它可以实现在网页中的快速跳转,但要注意元素id是唯一的,且链接要加上#符号。html同样可以在网页中插入图片内容,但要注意的是图片的绝对路径或是相对路径。需要呈现表格的时候使用到的是table标签,tr为行,td为行中单元,th为行头单元。列表分为有序列表和无序列表,通过不同的标签可以实现不同的标志。在设计的表单中则会涉及到很多元素的共同使用,html的元素可以适用区块和内联的方式来显示,对于预设格式使用到的是pre标签。对于某些特定字符则应该在html中使用字符实体才可进行准确显示。

学习时间:

2021年3月1日至2021年3月11日


自我实践截图

图片: 在这里插入图片描述运行截图1在这里插入图片描述运行截图2
在这里插入图片描述运行截图3

学习途中认为比较重要的代码

博客设置页面,选择一款你喜欢的代码片高亮样式,下面展示同样高亮的 代码片.

<a href="https://www.baidu.com/" target="_blank">百度一下</a>
<a href="https://www.baidu.com/" target="_self">百度一下</a>

_blank和_self的区别在于点击链接是在当前页面打开还是在新页面打开。

<img src="picture.jpg">该图片文件与当前文档在同一目录中
<img src="./images/picture.jpg">该图片文件在当前目录下的images目录中
<img src="../picture.jpg">该图片文件在上一级目录中

此处主要针对的是对于图片处在三个不同位置的处理方式。

<h2 id="C4">第四章 论零号病人的重要性</h2>
<a href="#C4">跳到第四章</a>

<a name="top" id="top"></a> 
<a href="#top" target="_self">返回顶部</a> 

通过查询资料了解到了如何在网页当前区域直接回到网页的最开始位置,只需要把上句代码放在首部,第二句代码放在所要跳转的地方即可。需要注意的点在于:元素的id值必须是唯一的,也即页面不能再有其它元素的id值为C4,超链接中的地址需要有#符号。

  • 1
    点赞
  • 6
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值