## HTML block element rows in a good fan ah! !

A: body which is divided into two tags: block-level tags and inline tags.

  1、块级标签:<p><h1><table><ol><ul><form><div>

  2、内联标签:<a><input><img><sub><sup><textarea><span>

II: Characteristics of block-level element tag
  ① always start on a new line;
  ② height, line height, and margins and padding can be controlled;
  ③ The default is 100% of the width of a container, a width setting unless .
  ④ It can accommodate inline elements and other block elements

Three: Features inline label elements
  ① and other elements on one line;
  high ②, line height, and margins and padding can not be changed;
  ③ its width is the width of the text or pictures, can not be changed
  within ④ inline elements only can receive text or other elements inline
four: for inline elements, precautions must be taken 
  to set the width width invalid.
  Invalid height set height, can be set by the line-height.
  Set margin is only about margin valid, invalid and down.
  Set padding only about padding effective, up and down would be invalid. Note that the range of elements is increased, but the content is no effect on the surrounding elements.

Five: inline elements list:

  <a> define the anchor tag

  <Abbr> shows an abbreviated form

  <Acronym> defined just take Acronym

  <B> bold font

  <Bdo> can override the default text direction

  <Big> Large bold font

  <br> wrap

  <Cite> definition referenced

  <Code> defined computer code text

  <Dfn> definition of a defined project

  <Em> is defined as the emphasis on content

  <I> italic text effect

  <Img> embedded in an image to a page <input> input box

  <Kbd> defined text keyboard

  <Label> tag is

  <Input> element defines the label (tag)

  <Q> defined short-REFERENCE

  <Samp> defined sample text

  <Select> Create a single or multiple select menu <small> small font rendering effect

  <Span> the combination of the row elements in the document

  <Strong> tone stronger emphasis on content

  <Sub> subscript text definition

  <Sup> defined superscript text

  <Textarea> multi-line text input control

  <Tt> typewriter text effects or width

  <Var> define the variable

Block-level elements list:

  <Address> define the address

  <Caption> Defines a table caption

  <Dd> a definition list definition entry

  <Div> definitions document partition or section

  <Dl> definition list

  <Dt> define the items in the list

  <Fieldset> defines a set of frame

  <Form> Creating HTML forms

  <H1> defines the maximum title

  <H2> defined subtitle

  <H3> Custom title

  <H4> Custom title

  <H5> Custom title

  <H6> defines the minimum title

  <Hr> to create a horizontal line

  <Legend> element is 

  <Fieldset> element defines the title

  <Li> tag defines a list of items

  <noframes>为那些不支持框架的浏览器显示文本,于 frameset 元素内部

  <noscript>定义在脚本未被执行时的替代内容

  <ol>定义有序列表

  <ul>定义无序列表

  <p>标签定义段落

  <pre>定义预格式化的文本

  <table>标签定义 HTML 表格

  <tbody>标签表格主体(正文)

  <td>表格中的标准单元格

  <tfoot>定义表格的页脚(脚注或表注)

  <th>定义表头单元格

  <thead>标签定义表格的表头

  <tr>定义表格中的行

扩展资料:

一,从概念的角度解释块级元素和行内元素

  1. 块级元素,一般都是从新行开始,它可以容纳行内元素和其他块元素,常见块级元素比如div/p等。“form”这个快元素比较特殊,他只能来容纳其他块元素

  2. 行内元素:也叫做内联元素,一般都是语义级别的基本元素,内联元素已办只能容纳文本或者其他内联元素

      块元素(block element)和内联元素(inline element)都是html规范中的概念。块元素和内联元素的基本差异是块元素一般都是从新行开始的。

      而当加了css控制以后,块元素可以变为内联元素,内联元素也可以变为块元素。

二,块级元素和内联元素的区别

  1. 块级元素会独占一行,其宽度自动填满其父元素宽度

   行内元素不会独占一行,相邻的行内元素会排列到同一行里,直到一行排不下,才会换行,其宽度随元素的内容变化而变化,

  2. 一般情况下,块级元素可以设置width,height属性,行内元素设置width,height无效

    (注意,块级元素设置了width宽度属性后仍然是独占一行的)

  3. 块级元素可以设置margin,padding属性

   行内元素的水平方向的padding-left和padding-right都会产生边距效果,但是竖直方向上的padding-top和padding-bottom都不会产生边距效果

Guess you like

Origin www.cnblogs.com/liurui-bk517/p/11074092.html