<pre class="html" name="code"><html xmlns="http://www.w3.org/1999/xhtml">

<head>

	<title></title>

</head>

<body>

<p>

块状元素

一般是其他元素的容器，可容纳内联元素和其他块状元素，块状元素排斥其他元素与其位于同一行，宽度(width)高度(height)起作用。常见块状元素为div和p,body

</p>

<p style="display:inline">将块状元素转换成内联元素:将display设为inline就可以了<p>

<p>

内联元素

内联元素只能容纳文本或者其他内联元素，它允许其他内联元素与其位于同一行，但宽度(width)高度(height)不起作用。常见内联元素为“a”“span”

</p>

<a href="http://www.baidu.com" style="display:block">将内联元素转换成块状元素:将display设为block就可以了</a>

</body>

</html>

 
 
 
 
 
 
原文链接：http://www.tuicool.com/articles/nyEziqe
 
 
 

块状元素(div)与内联元素（span）的更多相关文章

  1. [19/06/05-星期三] CSS基础_样式表的位置(内联、内部、外部样式)、块元素(div)、内联元素(span)、常用的选择器

    一.概念 CSS(Cascading Style Sheets,层叠样式表) 可以用来为网页创建样式表,通过样式表可以对网页进行装饰. 所谓层叠,就是可以将整个网页想象成是一层一层的结构,层次高的将会 ...

  2. html中的块元素(Block)和内联元素(Inline)(转)

    我们首先要了解,所有的html元素,都要么是块元素(block).要么是内联元素(inline).下面了解一下块元素.内联元素各自的特点: 块元素(block)的特点: 1.总是在新行上开始:2.高度 ...

  3. HTML元素分类 块级元素 内联元素 块级内联元素

    概述 HTML中存在许多元素,如<h1>,<p>,<a>,<block>,<image>,这些元素可分为三类,依次是块级元素,内联元素,块级 ...

  4. 块元素block，内联元素inline; inline-block;

    block:块元素的特征 div ol li 等: 1.只有高度不设置宽度的时候默认撑满一行: 2.默认块元素不在一行: 3.支持所以CSS命令: inline:内联元素的特征 span i stro ...

  5. 【CSS3】---块状元素、内联元素(又叫行内元素)和内联块状元素

    元素分类 在CSS中,html中的标签元素大体被分为三种不同的类型:块状元素.内联元素(又叫行内元素)和内联块状元素. 常用的块状元素有: <div>.<p>.<h1&g ...

  6. HTML元素分类:块级元素 内联元素和内联块状元素

    在CSS中,html中的标签元素大体被分为三种不同的类型:块状元素.内联元素(又叫行内元素)和内联块状元素. 1,块状元素 常用的块状元素有: <div>.<p>.<h1 ...

  7. CSS - 块状元素、内联元素和内联块状元素

    在CSS中,html中的标签元素大体被分为三种不同的类型:块状元素(block).内联元素(又叫行内元素,inline)和内联块状元素(inline-block). 1. 常用的块状元素有: < ...

  8. Css中的两个重要概念：块状元素和内联元素

    一.display:block display:block就是将元素显示为块级元素,一般是其他元素的容器,可容纳内联元素和其他块状元素,块状元素排斥其他元素与其位于同一行,宽度(width)高度(he ...

  9. css块级元素,内联元素,内联块状元素

    块元素 什么是块级元素?在html中<div><p><h1><form><ul>之类的就是块级元素.设置display:block是就将元素 ...

随机推荐

  1. ueditor调用其中的附件上传功能

    ueditor实际上是集成了webuploader, 在做内容发布的时候想既有ueditor又有单独的附件上传按钮,这时再加载一个webuploader就显得过于臃肿了,单独利用ueditor的上传功 ...

  2. chrome/ie中图片底部多出几像素问题

    如果给图片的父元素设置背景色,则图片的底部就会多出几像素,chrome/IE/FF中均是如此,如下图: 代码如下,就是简单的div中放张图片: <!doctype html> <ht ...

  3. 常用软件:Bugzilla的搭建(转)

    1.安装依赖包yum -y install php perl httpd mod_ssl mysql-server mysql-devel mysql php-mysql gcc mod_perl-d ...

  4. struts2中web.xml的配置

    在web.xml</web-app>前添加的<filter></filter>和<filter-mapping></filter-mapping& ...

  5. SQL存在一个表而不在另一个表中的数据， 更新字段为随机时间

    --更新字段为随机时间 86400秒=1天 UPDATE dl_robot ), ,GETDATE()) )   SQL存在一个表而不在另一个表中的数据   方法一 使用 not in ,容易理解,效 ...

  6. [Linux] - centos使用mount + nfs 远程共享存储

    服务端安装nfs 1.使用yum安装nfs yum install nfs-utils nfs-utils-lib -y 如果安装过程出现这样的错误: 得先安装lvm2 yum install -y ...

  7. 承接cardboard外包，unity3d外包（北京动软— 谷歌CARDBOARD真强大）

    手把手教你玩转googlecardboard[不知道在这里发可以不?] 谷歌Google I/O开发者大会于北京时间6月26日0点在美国旧金山举行,谷歌发布了Android L手机系统:Android ...

  8. linux下重置mysql的root密码

    # /etc/init.d/mysql stop # mysqld_safe --user=mysql --skip-grant-tables --skip-networking & # my ...

  9. 关于redis的主从复制

    redis主从复制需要注意的一个问题 这两天我朋友在使用redis偶尔会遇见一个问题,就是所有的缓存莫名其妙会不见,找了好久都没找到,他一直以为 有人错误执行了什么命令 他跟我说的时候我估计是主从复制 ...

  10. sqlite里执行查询提示未启用约束、主键冲突之——数据竟能超字段长度存储

    数据表设计如图:szflbm为主键 数据表主键数据: 以上数据在查询时,执行到该语句adapter.Fill(table); 提示主键冲突. 解决: 1.尝试修改数据,把ZC1改成ZZ,正常.说明原因 ...