行內元素與塊級元素,以及轉換


<div>定義文檔中的分區或節

<h1>定義最大的標題

<h2>定義副標題

<h3>定義標題

<h4>定義標題

<h5>定義標題

<h6>定義最小的標題

<ul>定義無序列表

<ol>定義有序列表

<li>定義有序列表或無序列表的列表項目

<dl>定義自定義列表

<dd>定義自定義列表中的條目

<dt>定義自定義列表中的項目

<hr>創建一條水平線

<p>定義段落

<table>定義表格

<td>表格中的標准單元格

<th>定義表頭單元格

<thead>標簽定義表格的表頭

<tr>定義表格中的行
復制代碼

行內元素:(以下列舉比較常用的行內元素,詳情可在w3cschool查詢)

復制代碼
<a>定義超鏈接

<b>字體加粗

<span>定義在文檔中的行內元素

<img>向網頁中插入題圖像

<input>輸入框

<small>小號字體效果

<br>換行

<big>字體加大加粗

<strong>強調的語氣

<select>創建單選或多選菜單

<textarea>定義文本域,多行的文本輸入控件
復制代碼

行內元素與塊級元素的區別:


1.行內元素與塊級函數可以相互轉換,通過修改display屬性值來切換塊級元素和行內元素,行內元素display:inline,塊級元素display:block

2.行內元素和其他行內元素都會在一條水平線上排列,都是在同一行的;

 塊級元素卻總是會在新的一行開始排列,各個塊級元素獨占一行,垂直向下排列,若想使其水平方向排序,可使用左右浮動(float:left/right)讓其水平方向排列。

3.行內元素不可以設置寬高,寬度高度隨文本內容的變化而變化,但是可以設置行高(line-height),同時在設置外邊距margin上下無效,左右有效,內填充padding上下無效,左右有效;

 塊級元素可以設置寬高,並且寬度高度以及外邊距,內填充都可隨意控制。

4.塊級元素可以包含行內元素和塊級元素,還可以容納內聯元素和其他元素;

 行內元素不能包含塊級元素,只能容納文本或者其他行內元素。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM