<html>

<head>

<script type="text/javascript">

    function removeElement() {

        document.getElementById("p1").style.display = "none";

        document.getElementById("d1").style.display = "none";

    }

    function showElement() {

        document.getElementById("p1").style.display = "block";

        document.getElementById("d1").style.display = "block";

    }

</script>

</head>

<body>

<h1>This is a header</h1>

<div id="d1">xxxxxxxxxxxxxxxxxxxxxxxxxx</div>

<p id="p1">This is some text. This is some text. This is some text.

This is some text. This is some text. This is some text.

This is some text. This is some text. This is some text.</p>

<input type="button" onclick="removeElement()" value="Do not display paragraph" />

<input type="button" onclick="showElement()" value="display paragraph" />

</body>

</html>

CSS的display属性，显示或隐藏元素的更多相关文章

  1. jquery控制css的display属性(显示与隐藏)

    jquery控制div的显示与隐藏,很方便的. 例如: $("#id").show()表示display:block, $("#id").hide()表示dis ...

  2. Code笔记之：CSS+HTML display 属性

    display属性值:none 此元素不会被显示. block 此元素将显示为块级元素,此元素前后会带有换行符. inline 默认.此元素会被显示为内联元素,元素前后没有换行符. inline-bl ...

  3. CSS的display属性

    网页设计中最常用的标签p.div.h1-h6(默认为块级元素),span(默认为内联元素) 内联,内嵌,行内属性标签: 1.默认同行可以继续跟同类型标签: 2.内容撑开宽度 3.不支持宽高 4.不支持 ...

  4. html显示与隐藏元素的几种方式

    html显示与隐藏元素的几种方式 1.display none : 无 隐藏元素 block : 显示 转换为块级元素   不占位:当隐藏的时候元素就完全没有了.不能看见和操作该元素. 优点:为其他元 ...

  5. !!!css如何让img图片居中？css的display属性实现图片居中（代码实例）

    在我们开发前端页面的时候,为了让页面效果美观,会让图片呈现居中效果.那么css怎么让img图片居中显示呢?本篇文章给大家带来css如何让img图片居中?css的display属性实现图片居中(代码实例 ...

  6. 如何使用Bootstrap4显示和隐藏元素

    如何使用Bootstrap4显示和隐藏元素 为了更快地进行移动设备开发,请使用响应式显示类来按设备显示和隐藏元素.避免创建相同站点的完全不同版本,而是相应地为每个屏幕大小隐藏元素. 要隐藏元素,只需使 ...

  7. (十二)学习CSS之display属性

    参考:http://www.w3school.com.cn/cssref/pr_class_display.asp 浏览器支持 所有主流浏览器都支持 display 属性. 注释:如果规定了 !DOC ...

  8. JS无法获取display为none的隐藏元素的宽度和高度的解决方案

    在实际开发中会遇到确实需要获取隐藏元素的宽高,这儿所说的隐藏元素是display为none的元素. 可使用jQuery Actual Plugin插件来完成,其源码如下: ;( function ( ...

  9. HTML的display属性将行内元素、块状元素、行内块状元素互相转换以及三者的区别

    1.行内元素 查看演示 (1)设置宽高无效 (2)对margin仅设置左右方向有效,上下无效:padding设置上下左右都有效,即会撑大空间 (3)不会自动进行换行 <html> < ...

  10. JS获取display为none的隐藏元素的宽度和高度的解决方案

    有时候,我们一进入页面,就需要获取display为none元素的物理尺寸(宽高),或获取display为none元素的子元素的物理尺寸(宽高),本篇文章就如何解决以上问题给出自己的解决方案 <h ...

随机推荐

  1. linux根分区扩容

    Linux 根分区扩容 1.fdisk –l  (红线部分为新添加的硬盘) 2.磁盘格式化 3. mkfs.ext3 -T largefile /dev/sde(格式化上面的分区) 4. vgdisp ...

  2. loadrunner录制脚本出现urs.asmx解决方法：

    在loadrunner录制过程中可能出现如下脚本: 解决方法: 解决办法:打开IE9的Internet选项-->高级,把设置下面安全中“启用SmartScreen筛选器”不选中,IE默认是选中的 ...

  3. Xamarin.iOS项目提示error MSB3174:”TargetFrameworkVersion”的值无效

    Xamarin.iOS项目提示error MSB3174:”TargetFrameworkVersion”的值无效 错误信息:MSBulid\14.0\bin\Microsoft.Common.Cur ...

  4. 2015ACM/ICPC亚洲区长春站 G hdu 5533 Dancing Stars on Me

    Dancing Stars on Me Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 262144/262144 K (Java/Ot ...

  5. BZOJ3784 : 树上的路径

    树的点分治,在分治的时候将所有点到根的距离依次放入一个数组q中. 对于一棵子树里的点,合法的路径一定是q[L]..q[R]的某个数加上自己到重心的距离. 定义五元组(v,l,m,r,w),表示当前路径 ...

  6. objective-c "performSelector may cause a leak because its selector is unknown".

    #define SuppressPerformSelectorLeakWarning(Stuff) \ do { \ _Pragma("clang diagnostic push" ...

  7. [Algorithms(Princeton)] Week1 - PercolationStats

    public class PercolationStats { private int N; private int T; private double[] results; public Perco ...

  8. Html5的DeviceOrientation特性

    设备定位API 引用W3C中的设备定位API的规范描述可知,该API“……定义了多种新型DOM事件,旨在提供与主机设备相关的物理朝向与运动状态信息.”由API提供的数据产生自多种来源,其中包括设备上的 ...

  9. 【POJ】2828 Buy Tickets（线段树+特殊的技巧/splay）

    http://poj.org/problem?id=2828 一开始敲了个splay,直接模拟. tle了.. 常数太大.. 好吧,说是用线段树.. 而且思想很拽.. (貌似很久以前写过貌似的,,) ...

  10. BZOJ4143 [AMPPZ2014]The Lawyer

    Description Byteasar要制订m天的会议计划,一共有n场会议,第i场会议开始于第d[i]天的第a[i]秒,结束于第d[i]天的第b[i]秒. 对于每一天,请找出这一天的两场会议i,j, ...