HTML容器标签和文本标签

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

容器标签

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

文本标签

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

块级元素

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

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

行内元素

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

块级元素与行内元素

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

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

css中显示模式的切换

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

display取值

1、block 块级
2、inline 行内
3、inline-block 行内块级

原文地址:https://www.cnblogs.com/wfblog/p/8955763.html

时间: 2024-10-15 19:23:44

HTML容器标签和文本标签的相关文章

Firefox 新增容器标签:可同时登录多个用户

Mozilla昨天在Firefox夜间构建版50.0a1中增加了一个名为“容器标签Container Tabs”的实验性功能. Mozilla的工程师称,该功能可以将用户的浏览会话分到不同的容器中.这些隔离的容器可以让用户以不同的身份登录到同一个网站上.默认情况下,Firefox 夜间构建版带有四个容器:个人(蓝色).工作(橙色).银行(绿色)和购物(粉色),也就是说用户可以使用四个不同的 ID 登录同一个网站. 容器标签分隔来自网站的数据,而不是浏览器的数据 Mozilla 的工程师说,可以使

html标签,格式控制标签,内容容器标签,超链接标签,图片标签,表格

打开DREAMWEAVER,新建HTML,如下图: body的属性: bgcolor 页面背景色 background  背景壁纸.图片 text  文字颜色 topmargin  上边距 leftmargin   左边距 rightmargin 右边距 bottommargin  下边距 body属性用法示例: 格式控制标签: <font color="" face="" size=""></font> 分别控制字体的颜

ng-repeat不添加容器标签

如UL中的循环, 我们不期望添加额外的div之类的容器标签, 使用ng-repeat-start和ng-repeat-end可以实现 <li class="item item-icon-right" ng-repeat-start="chapter in chapterClass.chapters">{{chapter.chapter_name}} <span style="display: inline-block;float: rig

HTML入门 一般标签 内容容器标签

<h1></h1>***<h6></h6>  标题(会自动换行)  <p></p> 段落标签(段落之间自动空一行)  <div></div> 层标签(默认占一行 内容超出自动换行)   <span></span> 层标签(内容多大占多大) <ol></ol>有序标签     <ul></ul>无序标签   标签属性 type 更改序列号的形

03-HTML的body标签(文本标签)学习

<html> <head>  <title>HTML的body标签-文本标签学习</title>  <meta charset="utf-8"/> </head>  <body>  <!--标题标签-->  <h1 align="center">今天天气真好,适合学习</h1>  <h2>今天天气真好,适合学习</h2>  

java的基础标签

跨行业进入IT,感觉就像学习一门外语,基础标签就像英语中的单词是的,现在只会一个个单词,不会说话的感觉,痛苦呀. 1.文本格式控制标签 <font color="文本颜色" size="字体大小" face="什么字体">文本内容</font> <b></b>   字体加粗 <i></i>     字体倾斜  <em></em>强调,语气加强用 <

(五)Struts2 标签

所有的学习我们必须先搭建好Struts2的环境(1.导入对应的jar包,2.web.xml,3.struts.xml) 第一节:Struts2 标签简介 Struts2 自己封装了一套标签,比JSTL 强大,而且与Struts2 中的其他功能无缝结合. 当然Strust2 标签的内容很多,随着版本的升级,标签和属性越来越多.我们要掌握好核心标签及了解其他标签. 根据功能可以分为:数据标签,控制标签,界面标签,其他标签. 第二节:Struts2 数据标签 Property 标签:输出OGNL 表达

HTML基础-- 标签、表格

<html>    --开始标签 <head> 网页上的控制信息 <title>页面标题</title> </head> <body> 页面显示的内容 </body> </html>    --结束标签 <!--注释内容--> 注释 body的属性: bgcolor                 页面背景色 text                    文字颜色(规定所有文本颜色) topmar

HTML基础—一般标签、常用标签和表格的应用

<html>    --开始标签 <head> 网页上的控制信息 <title>页面标题</title> </head> <body> 页面显示的内容 </body> </html>    --结束标签 <!--注释内容--> 注释 body的属性: bgcolor                 页面背景色 text                    文字颜色(规定所有文本颜色) topmar