工作需要，搭建一个网站的模型，简单分成三个部分，标题栏，导航栏，主界面，效果如图：

但是点击界面的任意地方，中间的div块消失了，如图所示：

调试，发现在点击界面其他地方的时候display属性有变化：

调试，发现时命名css文件里的class时候用了类似关键字的命名，将class名称修改即可

因样式冲突引起的div消失问题的更多相关文章

  1. 百度地图api的覆盖物样式与bootstrap样式冲突解决办法

    使用百度地图api 和 bootstrap ,发现标注样式出现了问题 label左侧 宽度变得非常窄 正常情况下应该是下面这样的: 原因是boostrap样式和百度地图样式冲突了. 解决办法: .ba ...

  2. css样式冲突怎么解决？

    一个网页有时会使用两种CSS,那发生css样式冲突要怎么解决?下面本篇文章就来给大家介绍一下发生css样式冲突的解决方法,希望对大家有所帮助. css冲突怎么解决? 解决方法有很多,如果可以对html ...

  3. react 样式冲突解决方案 styled-components

    前置 在 react 中解决组件样式冲突的方案中,如果您喜欢将 css 与 js 分离,可能更习惯于 CSS-Modules:如果习惯了 Vue.js 那样的单文件组件,可能习惯于使用 styled- ...

  4. 第七十三篇：解决Vue组件中的样式冲突

    好家伙, 1.组件之间的样式冲突 默认情况下,写在.vue组件中的样式会全局生效,因此很容易造成多个组件之间的样式冲突问题. 举个例子: 我们在Left.vue的组件中添加样式 <templat ...

  5. SharePoint 2010 中使用Ztree和EasyUI样式冲突问题

    <style type="text/css"> /*解决ztree和SharePoint样式冲突问题*/ .ztree li a { display: inline-b ...

  6. CSS样式实现溢出超出DIV边框宽度高度的内容自动隐藏方法

    CSS样式实现溢出超出DIV边框宽度高度的内容自动隐藏方法 平时我们布局时候,有的文字内容多了会超过溢出我们限制的高度,有的图片会撑破DIV,让网页错位变乱. 这样我们就需要解决如何使用CSS来超出设 ...

  7. css 样式冲突问题

    CSS 样式冲突问题 问题: 当文件中样式名称相同时,易出现样式冲突问题,解决办法如下: 解决: 以 layer.js 中弹出层  .layui-layer-page .layui-layer-con ...

  8. 让元素div消失在视野中

    让元素div消失在视野中1.position:absolute/relative/fixed + 方位 top/bottom/left/right: -9999px2.display:none3.vi ...

  9. 怎么让一个div消失在视野里

    怎么让一个div消失在视野里 视野内隐藏 1.设置高度宽度为0 div { height: 0; width: 0; } 2.设置透明度为0 div { opacity: 0; } 3.设置displ ...

随机推荐

  1. JXNU暑期选拔赛

    最小的数 Time Limit : 3000/1000ms (Java/Other)   Memory Limit : 65535/32768K (Java/Other) Total Submissi ...

  2. Oracle中字符串连接的实现方法

    1.和其他数据库系统类似,Oracle字符串连接使用“||”进行字符串拼接,其使用方式和MSSQLServer中的加号“+”一样. 例如: SELECT '工号为'||FNumber||'的员工姓名为 ...

  3. A2W，W2A等的使用

    #include <atlbase.h> #include <atlconv.h> 代码块 { ...... USES_CONVERSION; CString TempDirP ...

  4. 事务 c#

    事务->:事务是恢复和并发控制的基本单位 ->事务具有四个特性:原子性.隔离性.一致性.持久性.这四个特性通常称为ACID Begin transaction/tran   --开始事务 ...

  5. mxnet下如何查看中间结果

    https://blog.csdn.net/disen10/article/details/79376631 固定权重:https://www.cnblogs.com/chenyliang/p/678 ...

  6. linux+nginx+mysql+php环境下，安装ecshop

    我们在工作过程中要经常和电商打交道,所以,学会安装ecshop是必须的. 下面我们来介绍一下ecshop的安装. nginx和php安装整合,在我前面的文章中有提到,这里就不做赘述了.mysql可以使 ...

  7. php 数字变汉字

    //数字变汉字 function getTheWord($num) { $arr_n = array('零', '一', '二', '三', '四', '五', '六', '七', '八', '九', ...

  8. UI简述

    UI的全称是user interface,即是用户界面.UI设计是指对软件的人机交互,操作编辑,界面美观的整体设计,从简单的角度来说就是,UI是视觉上的东西,包括logo.软件.网页的按钮.网页导航, ...

  9. Centos7编译安装zabbix-4.0.1

    架构组合:nginx1.9.10+php7.0.32+mysql5.7.22+zabbix4.0.1 nginx1.9.10 先装依赖 openssl-1.1.0f tar zxvf openssl- ...

  10. TCP 的那些事儿（下）(转)

    原文地址:http://kb.cnblogs.com/page/209101/ 作者: 陈皓  来源: 酷壳  发布时间: 2014-05-29 00:17  阅读: 18122 次  推荐: 19  ...