目录
2.想：记录笔记，下次不用看视频，直接看笔记就可以快速回忆。
四.操作:1:成功:课时 12 : 111-html中的特殊符号
1.w3school使用工具:很好使用，直接使用这个就可以编写例子
四.操作:3:成功：课时 14 : 113-图片路径中的相对路径和绝对路径
一.目的
1.想：学习前端知识
2.想：记录笔记，下次不用看视频，直接看笔记就可以快速回忆。
二.参考
1.SIKI学院:我参考此视频实操
- 我参考此视频实操
1.w3school官网:当做字典使用
1.菜鸟教程：当做字典使用
三.注意
四.操作:1:成功:课时 12 : 111-html中的特殊符号
1.运行效果
<!DOCTYPE html>
<html>
<head>
<title>我是标题</title>
</head>
<body>
<p>段落标签；< p >这个符号无法显示出来<p></p>
段落标签；&it,p >
</body>
</html>
1.w3school使用工具:很好使用，直接使用这个就可以编写例子
四.操作:2:成功：课时 13 : 112-显示图片
1.运行 效果：
<!DOCTYPE html>
<html>
<head>
<title>我是标题</title>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
</head>
<body>
<!-- img ：是显示图片的关键字
src ：是图片相对于此代码的路径
align ：对齐①bottom是文字在图片的底部
width ：宽度的像素，①数值：像素大小②百分比是相对于浏览器宽度，一般使用百分比 -->
<p><img src="img/1.jpeg" align="bottom" width="100px" >图片1</p>
<p><img src="img/1.jpeg" align="bottom" width="10%" >图片1</p>
<p><img src="img/01.jpeg" align="bottom" width="100px" alt="alt是当图片没有加载出来（路径/服务器加载慢）时候显示的文字内容，在这里我故意将图片路径写错，方便展示。" >图片1</p>
</body>
</html>
1.参考网址 ：字典查询
四.操作:3:成功：课时 14 : 113-图片路径中的相对路径和绝对路径
1.笔记
相对路径和绝对路径
path =
当前路径./xx.jpg
上一级路径../xx.jpg
上上一级路径../../xx.jpg (相对路径就是从当前路径寻找，当前路径只的是当前html所在路径)
下一级路径 xx/xx.jpg
path="C:\Users\souke\Desktop\web01\01.jpg"
一般在项目中都使用相对路径
1.运行结果
<!DOCTYPE html>
<html>
<head>
<title>我是标题</title>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
</head>
<body>
<!-- img ：是显示图片的关键字
src ：可以使用绝对可相对路径 -->
<p><img src="E:\Test\web\html\img/1.jpeg" align="bottom" width="100px" >我是绝对路径</p>
<p><img src="img/1.jpeg" align="bottom" width="10%" >我是相对路径</p>
<p><img src="./img/1.jpeg" align="bottom" width="10%" >./是当前路径的意思</p>
<p><img src="../1.jpeg" align="bottom" width="10%" >../是 是代码文件上一级路径的意思</p>
</body>
</html>
1万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
