当前位置:   article > 正文

元素显示模式-块级元素,行内元素_块元素的显示模式

块元素的显示模式

1. 块级元素

显示特点:独占一行(一行显示一个)默认由内容高度可设宽高

常见块级元素:<div>, <p>, <h1>-<h6> , <ul> , <ol>, <table> ,<form>, <fieldset>, <legend>, <article>, <section>, <aside>, <nav>, <header>, <footer>

2. 行内元素

显示特点:一行显示多个,宽度和高度默认由内容撑开,不可以设置宽高

常见行内元素:<a>, <span>, <img>, <em>, <u>, <code>, <mark>, <sup>, <sub>, <del>, <ins>, <input>

3. 行内块元素

显示特点:一行显示多个,可以设置宽高

代表标签:input ,textarea, button, select ,img...

特殊情况:img标签有行内块元素特点,但是chrome调试工具中显示结果是inlie

4. 元素显示模式

语法:

属性效果使用频率
display:block转换成块级元素较多
display:inline - block转换成行内块元素较多
display:inline转换为行内元素极少

block:块;大块;立方体;

inline:[计]内联

inherited : 继承

本文内容由网友自发贡献,转载请注明出处:【wpsshop博客】
推荐阅读
相关标签
  

闽ICP备14008679号