html5中的容器标签和文本标签

html中的容器级标签文本级标签,css中的块级元素行内元素是我们常常拿来比较的四个名词(行内块级暂时先不考虑)。

容器标签

容器级的标签可以简单的理解为能嵌套其它所有标签的标签
常见容器级的标签: div h ul ol dl li dt dd ...。

文本标签

文本级的标签对应容器级标签,只能嵌套文字/图片/超链接的标签
常见文本级的标签:span p buis strong em ins del ...。

块级元素

css中的块级元素基本与html中的容器级标签对应,包括: **p** div h ul ol dl li dt dd ...。

*ps:不用刻意去记忆哪些标签是文本级的哪些标签是容器级, 在企业开发中一般情况下要嵌套都是嵌套在div中, 或者按照组标签来嵌套(ul>li, ol>li , dl>dt+dd).*

行内元素

行内元素也基本与文本标签对应:span buis strong em ins del。

块级元素与行内元素

1.块级元素独占一行,行内元素不独占。 
2.如果没有设置宽高,块级元素默认与父元素一致,设置了则按设置的显示; 
行内元素不可以设置宽高,默认与包含的内容高度一致。

ps:为了能够让元素既能够不独占一行, 又可以设置宽度和高度, 那么就出现了行内块级元素

css中显示模式的切换

可以通过标签的display属性设置显示模式。

display取值

block 块级
inline 行内
inline-block 行内块级

容器标签和文本标签的使用实例

html5中的容器标签和文本标签的更多相关文章

  1. html5中的video标签和audio标签

    不管是否承认,flash早已不像过往那样如日中天了.亚马逊全面放弃flash.苹果放弃flash.安卓也放弃了移动端的flash支持.事实上flash已经不太适合web开发了,因为HTML5中的vid ...

  2. 检测是否支持HTML5中的Video标签

    //检测是否支持HTML5 function checkVideo() { if (!!document.createElement('video').canPlayType) { var vidTe ...

  3. 让IE8支持html5中的video标签

    这是一篇综合几个前辈的解决方案. 使用video的时候,要遇到的问题. ①不兼容ie9及其以下版本 在<head>里添加两行, 参考张鑫旭前辈的博客,但是在ie8中薄播放. <!-- ...

  4. 认识HTML5中的新标签与新属性

    前端之HTML5,CSS3(一) HTML5中常用内容标签 header标签 header标签定义文档的页眉,基本语法:<header>content</header>. na ...

  5. html5-8 如何控制html5中的视频标签和音频标签

    html5-8 如何控制html5中的视频标签和音频标签 一.总结 一句话总结:找到视频或者音频的element对象,然后查手册看对应的方法或者属性就可以,里面有控制的. 1.如何控制html5中的视 ...

  6. HTML5中常用的标签(及标签的属性和作用)

    1.标签:<!DOCTYPE>作用:声明是文档中的第一成分,位于<html>标签之前. 2.标签:<html>作用:此元素可告知浏览器其自身是一个HTML文档.属性 ...

  7. HTML容器标签和文本标签

    html中的容器级标签和文本级标签,css中的块级元素和行内元素是我们常常拿来比较的四个名词(行内块级暂时先不考虑).注:如果标签嵌套错误,可能会发生浏览器解析错误的情况,只是针对嵌套做的这个. 容器 ...

  8. HTML5中的语义标签兼容IE8以及更低版本的浏览器

    看某教程,说让HTML5的这些语义标签能够兼容低版本的浏览器,原文是“你可以设置css的display属性为block”.很好理解,就设置css样式为block嘛,那就直接设置咯: header, s ...

  9. 3. HTML中的容器标签

    什么是容器标签?在HTML开发中我们常常会使用一类标签作为容器放置一些内容,我们把这类标签称之为容器标签,可以作为容器标签的包括列表标签.表格标签.框架标签.布局标签,在这里我们就来总结下这些内容. ...

随机推荐

  1. 利用js与java交互

    为了方便网页和应用的交互,安卓系统WebView提供JavaScript网页脚本调用Java类方法的机制.只要调用addJavascriptInterface方法即可映射一个Java对象到JavaSc ...

  2. ListView中嵌套GridView点击事件

    做一个项目时,需要在ListView中嵌套GridView,因为ListView的每个条目中不一定出现GridView,那么问题来了,添加GridView的Item的点击事件后,有GridView出现 ...

  3. Mac安装composer安装Yii2项目

    [注释:]本人原创,如需转载请注明来源链接! 通过安装Composer方式安装Yii 如果还没有安装 Composer,你可以按 getcomposer.org 中的方法安装. 在 Linux 和 M ...

  4. redis 扩展 windows

    下载地址:http://windows.php.net/downloads/pecl/releases/redis/

  5. [NOIP2012提高组]国王游戏

    题目:洛谷P1080.Vijos P1779.codevs1198. 题目大意:国王和每个大臣左.右手各写了一个数.规定每个大臣得到的金币数为他前面所有人左手的数字的乘积除以他自己右手的数(向下取整) ...

  6. C++输入流

    输出流基本概念  输出流定义在头文件中.大部分程序都会包含头文件,这个头文件又包含了输入流和输出流头文件.头文件还声明了标准控制台输出流cout.  使用输出流的最简单的方法是使用<<运算 ...

  7. 伸缩--也可用于tabs

    var $ranklist_li = $("div.ranklist_model ul li"); $ranklist_li.hover(function () { $(this) ...

  8. 编程算法 - 篱笆修理(Fence Repair) 代码(C)

    篱笆修理(Fence Repair) 代码(C) 本文地址: http://blog.csdn.net/caroline_wendy 题目: 把一块木板切成N块, 每次切两块, 分割的开销是木板长度, ...

  9. Zookeeper简单概念介绍

    过去,每个应用都是一个CPU.一个主机上的单一系统.然而今天,随着大数据和云计算时代的到来,不论什么相互独立的程序都可以运行在多个计算机上.然而面临的问题是,协调这些集群的系统比在单一主机上要复杂的多 ...

  10. C++关于二进制位操作小结

    #include <iostream> using namespace std; //二进制位逆序. int Grial(int x) { int n = 32; int count = ...