目录搜索
Attributesaccesskey (attribute)class (attribute)contenteditable (attribute)contextmenu (attribute)data-* (attribute)dir (attribute)draggable (attribute)dropzone (attribute)Global attributeshidden (attribute)id (attribute)itemid (attribute)itemprop (attribute)itemref (attribute)itemscope (attribute)itemtype (attribute)lang (attribute)slot (attribute)spellcheck (attribute)style (attribute)tabindex (attribute)title (attribute)translate (attribute)Elementsaabbraddressareaarticleasideaudiobbasebdibdoblockquotebodybrbuttoncanvascaptioncitecodecolcolgroupdatadatalistdddeldetailsdfndialogdivdldtemembedfieldsetfigcaptionfigurefooterformh1headheaderhrhtmliiframeimginputinput type="button"input type="checkbox"input type="color"input type="date"input type="datetime"-localinput type="email"input type="file"input type="hidden"input type="image"input type="month"input type="number"input type="password"input type="radio"input type="range"input type="reset"input type="search"input type="submit"input type="tel"input type="text"input type="time"input type="url"input type="week"inskbdlabellegendlilinkmainmapmarkmenumenuitemmetameternavnoscriptobjectoloptgroupoptionoutputpparampicturepreprogressqrprtrtcrubyssampscriptsectionselectslotsmallsourcespanstrongstylesubsummarysuptabletbodytdtemplatetextareatfootththeadtimetitletrtrackuulvarvideowbrMiscellaneousAttributesBlock-level elementsCORS enabled imageCORS settings attributesElementInline elementsKinds of HTML contentLink typesMicrodataOptimizing your pages for speculative parsingPreloading contentReferenceSupported media formatsUsing the application cacheObsoleteacronymappletbasefontbigblinkcentercommandcontentdirelementfontframeframesethgroupimageinput type="datetime"isindexkeygenlistingmarqueenextidnoframesplaintextstrikettxmp
文字

HTML(超文本标记语言)元素通常是“块级”元素或“内联”元素。块级元素占据其父元素(容器)的整个空间,从而创建一个“块”。本文有助于解释这意味着什么。

浏览器通常在元素之前和之后用换行符显示块级元素。你可以将它们想象成一堆盒子。

一个块级元素总是从一个新行开始,占用全部可用的宽度(尽可能地向左和向右伸展)。

以下示例演示了块级元素的影响:

块级元素

HTML

<p>This paragraph is a block-level element; its background has been colored to display the paragraph's parent element.</p>

CSS

p { background-color: #8ABB55; }

用法

  • 块级元素可能只出现在<body>元素中。

Block-level vs. inline

块级元素和内联元素之间有几个关键的区别:

格式化默认情况下,块级元素以新行开始,但内联元素可以从行中的任何位置开始。内容模型一般而言,块级元素可能包含内联元素和其他块级元素。在这种结构性区分中固有的概念是块元素创建“更大”的结构比内联元素。

块级和内联元素的区别在4.01以下的HTML规范中使用。在HTML5中,这种二元区别被更复杂的一组内容类别所取代。“块级”类别大致对应于HTML5 中流量内容的类别,而“内联” 类别对应于短语内容,但还有其他类别。

元素

以下是所有HTML块级元素的完整列表(尽管“块级”在技术上未定义为HTML5中新增的元素)。

<address>联系信息。  <article> HTML5   文章内容。  <aside> HTML5   Aside内容。<blockquote>长(“块”)报价。  <canvas> HTML5   绘图画布。<dd>在描述列表中描述一个术语。<div>文档部门。<dl>说明列表。<dt>说明列表术语。<fieldset>字段设置标签。    <figcaption> HTML5   图标题。  <figure> HTML5将   媒体内容与标题分组(请参阅<figcaption>)。  <footer> HTML5   部分或页面页脚。<form>输入表单。  <h1><h2><h3><h4><h5><h6>  标题级别1-6。  <header> HTML5   部分或页面标题。  <hgroup> HTML5  组头信息。<hr>横向规则(分界线)。<li>项目清单。<main>包含此文档特有的中央内容。<nav>包含导航链接。   <noscript>不支持或关闭脚本的内容。<ol>有序列表。  <output> HTML5   表单输出。<p>段。<pre>预先格式化的文本。    网页的<section> HTML5部分。<table>表。<tfoot>表页脚。<ul>无序列表。  <video> HTML5   视频播放器。

上一篇:下一篇: