html-初级标签
一.浏览器能识别的标签
1.1 head标签里的编码和title
<head><meta charset="UTF-8"><title>Title</title>
</head>
1.2 标题
<body><h1>Welcome to my website</h1><h2>Welcome to my website</h2><h3>Welcome to my website</h3><h4>Welcome to my website</h4><h5>Welcome to my website</h5><h6>Welcome to my website</h6>
</body>
1.3 div 和span
<div>content</div>
<span>content</span>
区别：
- div: 一个div直接占一行 [块级标签]
- span：自己多大就占多少 [行内标签. 内联标签]
<body><div>山东蓝翔</div><div>哪家强</div><span>蓝翔山东</span><span>强哪家</span>
</body>
效果：
1.4 超链接
1.4.1 跳转到其他网站，需要填写完整url地址
<div><a href="https://www.baidu.com/">百度网址</a></div>
1.4.2 跳转到自己网站，填写完整url和端口后面的url地址均可
<div><a href="https://www.baidu.com/">百度网址</a></div>
<div><a href="/show/news">news</a></div>
1.4.3 图片标签
- flask框架会默认去找当前项目目录下的static文件夹下的图片
<div><img src="/static/images/icon.png" alt="logo">
</div>
1.4.4 a 标签中包含img标签
<div><a href="https://www.bilibili.com/"><img style="width: 100px; height: 100px;" src="/static/images/icon.png" alt="logo"></a>
</div>
如果想要在跳转链接的时候，重新打开一个新的窗口。可以添加 target=“_blank”
<div><a href="https://www.bilibili.com/" target="_blank"><img style="width: 100px; height: 100px;" src="/static/images/icon.png" alt="logo"></a></div>