在html中,行內塊級元素分別是:用于標記網頁中圖像的img;用于搜集用戶信息的input;標簽定義表格中標準單元格的td;可創建單選或多選菜單的select;定義多行的文本輸入控件的textarea;為input元素定義標注的label。
本教程操作環境:windows7系統、CSS3&&HTML5版、Dell G3電腦。
行內塊狀元素綜合了行內元素和塊狀元素的特性,但是各有取舍。因此行內塊狀元素在日常的使用中,由于其特性,使用的次數也比較多。
行內塊狀元素特征:
-
不自動換行
-
能夠識別寬高
-
默認排列方式為從左到右
內聯塊級元素比較少,它們分別是:img、input、td、select、textarea、label;
img:用于標記網頁中的圖像 ,有屬性src:圖片資源路徑 ,alt:提示信息 當圖片加載失敗 ,以指定文本形式代替圖片顯示
input:輸入框,有屬性type輸入框類型,有屬性值(text表示文本輸入框,file文件選擇器,password密碼輸入框,email郵箱輸入框,number數字輸入框,button按鈕)。placeholder占位字符,用于提示輸入框應該輸入的內容。value表示輸入框中的內容。name和后臺服務器交互時,必須攜帶name屬性,發送請求時的參數名。
單選 type=“radio” 表示一個單選選項處于同一組單選框只能選中一個值,將多個radio的name屬性值設置為相同的值type="checkbox"復選框
label:和input標簽綁定到一塊使用,有屬性for,屬性值就是input輸入框的id值。checked屬性為標簽選中狀態
select:下拉列表
擴展資料:
內聯塊級元素的轉換
通過設置CSS樣式屬性display:inline-block,可將內聯元素,或塊級元素轉換成內聯塊級元素;
但如果是將元素轉換成內聯元素,則設置display:inline;
如果是將元素轉換成塊級元素,則設置display:block;
inline-block是css2.1新增的屬性,對于IE7以下的版本不支持這個屬性,所以需要一些兼容的辦法。
推薦學習:html視頻教程