`
moqiang02
  • 浏览: 529394 次
  • 性别: Icon_minigender_1
  • 来自: 苏州
文章分类
社区版块
存档分类
最新评论

<div>里用display:block有用么?

阅读更多
对所有的块元素都没有意义,块元素的dispaly属性默认值为block,没必要再显式定义——除非你之前对块元素的display属性重新定义过。
===========================
多罗嗦一句:
display:block;比较常用于<a><span>这两个标签——因为这两个标签非块元素,如果不用display:block定义一下,那么定义width、height等和长宽相关的css属性时会发现完全不生效。你可以实际写几行简单代码感受一下。
===========================
是不是div里就没有必要写display:block呢?通常情况下是没有必要的。
常见的特殊情况:之前曾对div设置过display:hidden。
分享到:
评论

相关推荐

    前端分页jsp实现(二)

    &lt;div style="display: block;height: 200px;"&gt; &lt;jsp:include page="pagination.jsp" flush="true"&gt; &lt;jsp:param name="pageNo" value="7" /&gt; &lt;jsp:param name="totalPage" value="10"/&gt; &lt;/jsp:include&gt; &lt;/div&gt;

    CSS中display:block的作用介绍

    &lt;div&gt;是块元素,那在布局时候,在div的元素里面写display:block有用吗? 回答:对所有的块元素都没有意义,块元素的dispaly属性默认值为block,没必要再显式定义——除非你之前对块元素的display属性重新定义过。 ...

    【JavaScript源代码】vue backtop组件的实现完整代码.docx

    vue backtop组件的实现完整代码  效果: 代码: &lt;template&gt; &lt;div class="back-top"&gt; ... 'block': 'none')}" @click="backTop"&gt; &lt;/div&gt; &lt;/div&gt; &lt;/template&gt; &lt;script&gt; export default { name: "backTop", 

    eclipse-testng 离线包下载

    eclipse-testng 离线包&lt;?xml version="1.0" encoding="UTF-8"?&gt; &lt;xsl:stylesheet version="2.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns:math="http://exslt.org/math" xmlns:testng=...

    纯css带箭头div

    &lt;head&gt;...高度自动增加,应该不错吧^_^&lt;br&gt;&lt;br&gt;&lt;br&gt;&lt;br&gt;&lt;br&gt;&lt;br&gt;&lt;br&gt;&lt;br&gt;&lt;br&gt;&lt;br&gt;&lt;br&gt;&lt;br&gt;&lt;br&gt;&lt;br&gt;&lt;br&gt;&lt;br&gt;&lt;br&gt;&lt;br&gt;&lt;br&gt;&lt;br&gt;&lt;/div&gt; &lt;s&gt; &lt;i&gt;&lt;/i&gt; &lt;/s&gt; &lt;/div&gt; &lt;br /&gt; &lt;/body&gt; &lt;/html&gt;

    css中display:block;的用法及适用标签详解

    比较常用于&lt;a&gt;&lt;span&gt;这两个标签——因为这两个标签非块元素,如果不用display:block定义一下,那么定义width、height等和长宽相关的css属性时会发现完全不生效。 通常情况下div里就没有必要写display:block;特殊...

    HTML5一笔连珠小游戏.zip

    代码片段: &lt;div absolute; top: 0px; left: 0px; width: 100%; height: 100%; background-image: url(image/menu.png); background-attachment: initial;... display: block;... "&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;

    js实现精致折叠菜单

    &lt;DIV id=file5 style="DISPLAY: block"&gt; &lt;UL&gt; &lt;LI&gt;&lt;IMG src="images/_line4.gif" align=absMiddle&gt;&lt;IMG src="images/_line1.gif" align=absMiddle&gt;&lt;IMG src="images/file.gif" align=absMiddle&gt;&nbsp;&lt;A ...

    display:inline的用法

    &lt;div&gt; DIV1 &lt;/div&gt; &lt;div&gt; DIV2 &lt;/div&gt; 这里DIV1和DIV2分别占一行,但是你给他们加上属性后变了 &lt;div xss=removed&gt; DIV1 &lt;/div&gt; &lt;div xss=removed&gt; DIV2 &lt;/div&gt; DIV1和DIV2这时候显示在同一行了,试试看吧 ...

    无图片实现圆角框,不需要加入背景图片

    可以实现圆角框背景 &lt;html&gt; &lt;head&gt; &lt;title&gt;css圆角效果&lt;/title&gt; &lt;meta ...&lt;b class="rbottom"&gt;&lt;b class="r4"&gt;&lt;/b&gt;&lt;b class="r3"&gt;&lt;/b&gt;&lt;b class="r2"&gt;&lt;/b&gt;&lt;b class="r1"&gt;&lt;/b&gt;&lt;/b&gt; &lt;/div&gt; &lt;/body&gt; &lt;/html&gt;

    js 框架之一

    &lt;br&gt; }&lt;br&gt; &lt;/script&gt;&lt;br&gt; &lt;/head&gt;&lt;br&gt; &lt;br&gt; &lt;body&gt;&lt;br&gt; &lt;div id=cpst style="display:none"&gt;&lt;br&gt; &lt;br&gt; &lt;iframe src="image/cpst.jpg" &lt;br&gt;style="position:absolute; visibility:inherit; top:0px; left:0px; ...

    音乐有关的文件

    &lt;%@ page language="java" import="java.util.*" pageEncoding="utf-8"%&gt; &lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"&gt; &lt;html&gt; &lt;head&gt; &lt;title&gt;音乐播放器&lt;/title&gt; &lt;/head&gt; &lt;body&gt; ...

    浮点vfdsfJAVA实现链表,双向链表.txtJAVA实现链表,双向链表.txt

    &lt;li&gt;预计剩余时间:&lt;span id="uploadlefttime"&gt;&lt;/span&gt;&lt;/li&gt; &lt;li&gt;上传文件大小: &lt;span id="uploadtotal"&gt;&lt;/span&gt;&lt;/li&gt; &lt;li&gt;已上传大小:&lt;span id="uploadcurrent"&gt;&lt;/span&gt;&lt;/li&gt; &lt;/ul&gt; &lt;/form&gt; &lt;/div&gt; &lt;/div...

    仿Facebook底部工具栏的实现

    &lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;...

    网页特效

    &lt;li class="top"&gt;&lt;a href="#" class="top_link"&gt;&lt;span&gt;我的音乐盒&lt;/span&gt;&lt;/a&gt;&lt;/li&gt; &lt;li class="top"&gt;&lt;a href="#" class="top_link"&gt;&lt;span&gt;我的介绍&lt;/span&gt;&lt;/a&gt;&lt;/li&gt; &lt;li class="top"&gt;&lt;a href="#" class="top_link...

    css中display和visibility的用法和区别介绍

    Display的属性值 block:/*表现为一个块级元素(一般情况下独占一行)*/当display被设置为block(块)时,容器中所有的元素将会被当作一个单独的块,就像&lt;DIV&gt;元素一样,它会在那个点被放入到页面中。(实际上你可以...

    The Art of Assembly Language Programming

    The 80x86 MOV Instruction&lt;br&gt;4.8 - Some Final Comments on the MOV Instructions&lt;br&gt;&lt;br&gt;4.9 Laboratory Exercises&lt;br&gt;4.9.1 The UCR Standard Library for 80x86 Assembly Language Programmers&lt;br&gt;4.9.2 ...

    div与span的区别和使用示例

    2.块元素和行内元素也不是一成不变的,通过定义CSS的display属性值可以互相转化,如: 测试<div style="display:inline"&gt;紧跟前面的"测试"显示</div&gt;<span style="display:block"&gt;这里会另起一行显示</span&gt; ...

    左侧红色js悬浮QQ在线客服插件代码

    &lt;a title="隐藏" class="close_btn"&gt;&lt;span&gt;关闭&lt;/span&gt;&lt;/a&gt;&lt;/div&gt; &lt;div class="side_center"&gt; &lt;div class="qqserver"&gt; &lt;div class="KeFuTitle"&gt;在线客服&lt;/div&gt; &lt;div class="KeFuItem"&gt; &lt;a target="_blank" ...

    全屏幻灯片JQ+JS+CSS3

    &lt;script type='text/javascript' src='... &lt;div class="paging subpattern"&gt;&lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;script type='text/javascript' src='http://www.ic678.com/taobao/js/jquery.slider.js'&gt;&lt;/script&gt; &lt;/body&gt; &lt;/html&gt;

Global site tag (gtag.js) - Google Analytics