一.瀏覽器能識別的標簽
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>