39,084
社区成员
发帖
与我相关
我的任务
分享web前端学习第一天
还是忍不住发日记好啦，发来发去也不知道哪里发，就在这里发了，（纯属感兴趣在自学，并不打算以此为工作）在B站跟着视频入门，u1s1一边看一边自己敲还挺有意思的，今天的敲的就发出来了
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>标签应用</title>
</head>
<body>
<p id="top"></p>
<p>关于 表格 那一部分。</p>
<p>我理解 colspan 和 rowspan 并不是合并单元格， span是跨度的意思，<br /> = 2 实际上表示的是，让该单元格有2个单元格的列的大小，并不是将两个单元格进行合并。也就是说，它是视觉上看起来是，但实际上不是。所以老师才会说后面要删除多余的表格（因为不删，就会多出来，试一下就知道了。</p>
<p> 关于 N x N<strong>的合并单元格</strong>，其实<b>和上面同理</b>，写 colspan =2 rowspan=2 就能制作出2x2的单元格，再删去多余的单元格，就能使其看起来就好像合并了一样。</p>
<p><strong>我是加粗文字</strong> </p>
<p><em>我是倾斜文字</em> </p>
<p id="delete">我是<del>删除线</del> </p>
<p>我是<ins>下划线</ins></p>
<div>div标签会独占一行</div>
<div>div标签会独占一行</div>
<span>span标签会几个一起放</span>
<span>洋葱</span>
<span>西红柿</span>
<span>土豆</span>
<p>这是图像标签</p>
<img src="623b004cc0f2e46c2f6db6693bc0e6fb_t.gif" />
<p>src是必须属性，alt可以替换图像，当图像显示不出的时候替换成文字</p>
<img src="623b004cc0f2e46c2f6db6693bc0e6fb_t1.gif" alt="微信图片" />
<p>title会让鼠标放到图片上面提示文字</p>
<img src="623b004cc0f2e46c2f6db6693bc0e6fb_t.gif" title="微信图片" />
<p>width是给图像设定宽度 height是给图像修改高度</p>
<img src="623b004cc0f2e46c2f6db6693bc0e6fb_t.gif" title="微信图片" width="500" height="300" />
<p>border是给图像设定边框</p>
<img src="623b004cc0f2e46c2f6db6693bc0e6fb_t.gif" title="微信图片" width="500" height="300" border="10" />
<p>同一级路径直接输入</p>
<img src="623b004cc0f2e46c2f6db6693bc0e6fb_t.gif">
<p>下一级图片使用，src后面输入文件夹名字然后加上/</p>
<p>上一级文件夹使用见html文件夹的test.html</p>
<img src="img/846b2b2950ebd6d9385099ad69e5028d_t.gif" />
<p>绝对路径，是指文件在电脑里的位置</p>
<img src="C:\Users\Peng\Desktop\js学习之路\html与css\623b004cc0f2e46c2f6db6693bc0e6fb_t.gif" />
<p>同样的，我们可以使用网络上的图片地址，只需要复制网络上的图片地址即可</p>
<img src="https://www.baidu.com/img/PC_7ac6a6d319ba4ae29b38e5e4280e9122.png" alt="百度的图片" />
<p>超链接的使用</p>
<p>外链</p>
<div><a href="http://www.baidu.com">百度</a></div>
<div><a href="http://www.baidu.com" target="_blank">百度</a></div>
<div>_self是当前页面转为链接页面，_blank是用新窗口打开该页面</div>
<p>内链
<div>内链的同一级上一级以及下一级问题同图片</div>
</p>
<a href="02第一个html.html" target="_blank">第一个页面</a><br />
<a href="html/test.html" target="_blank">测试上一级图片的网址</a>
<p>herf输入#代表空链接，title是和图片一样</p>
<a href="#" title="还没有做好">空链接</a>
<p>下载链接，链接地址是应用程序或者压缩包就会下载这个文件</p>
<a href="lue.zip" title="这是下载链接">吐舌头</a>
<p>网页元素也是可以做链接的，只需要在原本文本的位置替换为图片的链接即可 ；效果如下</p>
<a href="https://www.baidu.com" target="_blank" title="百度"><img src="https://www.baidu.com/img/PC_7ac6a6d319ba4ae29b38e5e4280e9122.png" /></a>
<p>锚点标签的使用，需要给段落或者标题定义，在其p或者h后面加上id，链接则加上#以及id，例如</p>
<a href="#delete">删除线</a><br />
<a href="#top">返回顶部</a>
<p>注释标签的使用，需要在中括号里面加上！--然后以--中括号结尾即可</p>
<!-- 我啥也不想吃 -->
</body>
</html>
第一段文字是复制视频里的一个评论来练手的，总体感觉还是不错的，明天继续加油
(感觉会有人好奇我的图片长啥样，就po上来了)
...全文
请发表友善的回复…
发表回复
CSDN-Ada助手 2023-01-13
- 打赏
- 举报
您可以前往 CSDN问答-前端 发布问题, 以便更快地解决您的疑问
