1、html中的块级标签

  显示为“块”状,浏览器会在其前后显示折行。常用的块级元素包括:

  <p>, <ul>,<table>,<h1~h6>等。

2、html中的行级标签(内联元素)

  按行逐一显示,前后不会自动换行;

  文本格式化元素:

  <b>, <td>, <a>, <img>、

块级标签可以和行级标签转换

我们在实际的操作过程中往往会遇到给行级标签添加背景图片的尴尬情景。

那么在这种情况下我们就可以通过(display属性)将行级标签转换为块级标签的方式来实现需要的功能

span{
background:url(.jpg) 10px 10px no-repeat;
display:block;
} //这样我们就可以为span标签添加背景图片了
display:block;
display:inline;
display属性的三个取值:
.none:将某个元素隐藏 display: none;*将 div隐藏*
.block:将某个元素显示
.inline:将某个块级标签转换成了行级标签

HTML中的行级标签和块级标签 《转换》的更多相关文章

  1. html中的行内元素和块级元素小结

    一.首先我们总结下行内元素和块级元素有哪些: 行内元素: <a>标签可定义锚<abbr>表示一个缩写形式<acronym>定义只取首字母缩写<b>字体加 ...

  2. HTML常用的标签中,行内元素和块级元素

    块元素(block element) HTML标签分类明细 * address - 地址 * blockquote - 块引用 * center - 举中对齐块 * dir - 目录列表 * div ...

  3. CSS中的行内元素和块级元素

    我们在构造页面时,会发现有的元素是上下排列的,而有的则是横向排列的,这是为啥子呢   看看上图,我们也没给他设置啥子属性咋就不一样了,其实是因为每个元素都有默认的 display 属性,比如 div ...

  4. css中的行内元素和块级元素总结

    块级元素 <address>,  <button>,  <caption>,  <dd>,  <del>,  <div>,  & ...

  5. 04. H5标签有哪些?行内元素有哪些?块级元素有哪些?空(void)元素有哪些?行内元素和块级元素有什么区别?你工作中常用标签有什么?

    4. H5标签有哪些? 2)行内元素有哪些? a - 锚点 em - 强调 img - 图片 font - 字体设定 ( 不推荐 ) i - 斜体 input - 输入框 3)块级元素有哪些? add ...

  6. HTML <!DOCTYPE> 标签 布局引用的几种方法 行级元素与块级元素

    HTML <!DOCTYPE> 标签 <!DOCTYPE html> <html> <head> <title>文档的标题</titl ...

  7. HTML入门(转义字符、行内样式和块级元素、定位、锚点、跑马灯标签、图片标签、表格标签的讲解)

    一.转义字符由特殊字符包裹的文本 会当做标签去解析 对应不换行空格 对应全角空格 em是字体排印学的计量单位,相当于当前指定的点数.其占据的宽度正好是1个中文宽度,而且基本上不受字体影响.<对应 ...

  8. img标签到底是行内元素还是块级元素

    面试官问你<img>是什么元素时你怎么回答 写这篇文章源自我之前的一次面试,题目便是问img标签属于块级元素还是行内元素,当时想都没想就说了是行内(inline)元素,面试官追问为什么能够 ...

  9. HTML(四):行级标签和块级标签

    一.行级标签 行级标签又称为内联标签,行级标签不会单独占据一行,设置宽高无效,行内内部可以容纳其他行内元素,但不可以容纳块元素,不然会出现无法预知的效果. 常见行级标签: span.strong.em ...

随机推荐

  1. git远程上传文件

    [第一步]建立先仓库 第一步的话看一般的提示就知道了,在github新建一个repository(谷歌可以解决),都是可视化的界面操作,所以难度不大.或者看这里:https://help.github ...

  2. Hadoop2.0安装之非HA版

    主要步骤跟Hadoop1.0(1.0安装地址)一致,主要在配置这块有更改 安装 下载地址:http://archive.apache.org/dist/hadoop/core/hadoop-2.6.5 ...

  3. Angularjs中添加ckEditor插件

    使用方法看注释.主要解决帮上ngModel的问题 angular.module('newApp') .directive('ckeEditor', function() { return { /* F ...

  4. 如何在eclipse中用maven编译

    在eclipse中用maven编译的方法: 在项目中的“pom.xml”文件上点击右键,在弹出的菜单中选择“Run AS”à“Maveninstall”来编译和生成项目.如下图所示: 在编译和生成过程 ...

  5. git 手动操作

    git 手动操作 以下所有的情况都需要在上面那个目录下: 查看改动: git status // 所有改动都在这里. 提交代码: git add <file_name> // 把代码放到 ...

  6. 2015:WPS笔试-Android开发岗位

    题目一共三道: 一:实现一个函数,能够推断两条直线的关系:平行.重合.垂直或相交. 二:实现一个函数.能够得到随意两个日期的相隔天数. 三:针对题目一或题目二,实现一个完整的单元測试. (笔试后在网上 ...

  7. 我的Go语言学习之旅七:创建一个GUI窗口

    在上次中,刚刚学过了  弹窗效果.这里再接着学习一下怎样创建一个窗口. 还是老路子,先上代码: package main import ( "github.com/lxn/go-winapi ...

  8. PowerDesigner中导入MYSQL数据库结构的步骤及问题解决

    今天在使用PowerDesigner,要导入MySql的表结构到PowerDesginer里, 记录下详细的操作步骤: 1.首先要确保机器安装了MySql的ODBC驱动,去http://dev.mys ...

  9. R环境中的工作空间(workspace)

    工作空间(workspace)就是当前R的工作环境,它储存着全部用户定义的对象(向量.矩阵.函数.数据框.列表) . 在一个R会话结束时,你能够将当前工作空间保存到一个镜像中.并在下次启动R时自己主动 ...

  10. SoapUI项目书写自我规范

    -->Assertions 判断某个节点存在(_input_name, _button_name) -->Resource 文件夹命名 值去掉红色部分信息 https://mercury- ...