HTML5中的行級標簽和塊級標簽
當前位置:點晴教程→知識管理交流
→『 技術文檔交流 』
塊級標簽(block element) 1.獨占一行,不和其他元素待在同一行,寬度自動填滿父元素寬度。 2.可設置寬高(width,height)、內外邊距屬性(margin,padding)。 有div,p,h1-h6,ul,li,dl(定義列表,跟ul…li類似),dt(定義了定義列表中的項目),dd(定義描述項目的內容,跟dt一起搭配) 3.常見的塊級元素 * address - 地址 行級標簽(內聯元素 inline element) 1.行級標簽又稱為內聯標簽,行級標簽不會單獨占據一行,設置寬高(width,height)無效。 2.行內內部可以容納其他行內元素,但不可以容納塊元素。 3.行內元素的水平方向的padding-left和padding-right都會產生邊距效果,但是豎直方向上的padding-top和padding-bottom都不會產生邊距效果。 4.常見的行級標簽有span, strong, em, br, img , input, label, select, textarea, cite。 行內塊標簽(inline-block element) 1、能和其他元素待在一行 2、能設置寬高 有<img>,<input>,<textarea>等 a - 錨點 b - 粗體(不推薦) br - 換行 em - 強調 font - 字體設定(不推薦) i - 斜體 img - 圖片 input - 輸入框 label - 表格標簽 select - 項目選擇 small - 小字體文本 span - 常用內聯容器,定義文本內區塊 strike - 中劃線 strong - 粗體強調 sub - 下標 sup - 上標 textarea - 多行文本輸入框 tt - 電傳文本 u - 下劃線 行塊級標簽相互轉化 通過css樣式中的displiay屬性對行塊級標簽進行相互轉換,屬性值中inline(元素以行內標簽進行展示),block(元素以塊級標簽進行展示),inline-block(元素以行內塊級標簽進行展示)。 display屬性 可變元素可變元素為根據上下文語境決定該元素為塊元素或者內聯元素。 * applet - java applet * button - 按鈕 * del - 刪除文本 * iframe - inline frame * ins - 插入的文本 * map - 圖片區塊(map) * object - object對象 * script - 客戶端腳本 參考文章: https://www.cnblogs.com/Jackie0714/p/4923639.html https://blog.csdn.net/natalie86/article/details/42584321?utm_medium=distribute.pc_relevant.none-task-blog-BlogCommendFromMachineLearnPai2-4.channel_param&depth_1-utm_source=distribute.pc_relevant.none-task-blog-BlogCommendFromMachineLearnPai2-4.channel_param https://blog.csdn.net/nanjinzhu/article/details/82716522 閱讀原文:原文鏈接 該文章在 2025/7/18 10:25:32 編輯過 |
關鍵字查詢
相關文章
正在查詢... |