開發者學堂課程【HTML 入門與實戰:換行和div span标簽】學習筆記,與課程緊密聯系,讓使用者快速學習知識。
課程位址:
https://developer.aliyun.com/learning/course/593換行和div span标簽
目錄:
1,換行标簽的定義
2,div span标簽
單詞縮寫:break打斷,換行
在HTML中,一個段落中的文字會從左到右依次排列,直到浏覽器視窗的右端,然後自動換行。如果希望某段文本強制換行顯示,就需要使用換行标簽
<br />
這時如果還像在word中直接敲Enter鍵換行就不起作用了。
其中<br />就是換行标簽的符号,具體操作如下:
<! DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
< / head>
<body>
<h3>------------中國四大美女---------<h3>
1, 貂蟬<br />
2, 王昭君<br />
3, 楊玉環<br />
4, 鳳姐思密達<br />
< / body>
< / html>
這就是一個換行标簽的使用。
div span标簽(重點)
div span是沒有語義的,是我們網頁布局主要的2個盒子。
div就是division的縮寫分割,分區的意思其實有很多div來組合網頁。
span,跨度,跨距;範圍
文法格式:
<div>這是頭部</div> <span>今日價格</span>
它們使用例子如下:
5, 貂蟬<br />
6, 王昭君<br />
7, 楊玉環<br />
8, 鳳姐思密達<br />
Div 标簽的使用
<div>我是劉德華</div>
Span 标簽的使用
<span>我是劉曉慶</span>
使用結果如下:
![](https://img.laitimes.com/img/__Qf2AjLwojIjJCLyojI0JCLicmbw5iYlZ2YlhTMlBzNwQTN4UmYmRGO0MjY5IzN5QDNmFGN48CX5d2bs92Yl1iclB3bsVmdlR2LcNWaw9CXt92Yu4GZjlGbh5yYjV3Lc9CX6MHc0RHaiojIsJye.png)