工作需要，搭建一个网站的模型，简单分成三个部分，标题栏，导航栏，主界面，效果如图：
但是点击界面的任意地方，中间的div块消失了，如图所示：
调试，发现在点击界面其他地方的时候display属性有变化：
调试，发现时命名css文件里的class时候用了类似关键字的命名，将class名称修改即可
时间： 2024-12-22 16:05:07
因样式冲突引起的div消失问题
因样式冲突引起的div消失问题的相关文章
CSS 基本概念（Basic CSS Concepts）三、解决样式冲突
三.解决样式冲突(Resolving Style Conflicts) 在创建一个样式表的过程中,很可能有许多不同的规则将适用于同一个元素.例如,如果一个规则适用于所有的段落元素,另一个规则适用于具有一个具有紧急值的类属性的所有元素,那么应该使用哪一个规则? 当它发生时,这两个规则将适用.如果不同的规则包含处理不同属性的声明,那么就没有冲突,样式都是“组合在一起”的.但是,如果有不同的规则试图为同一个属性设置值的声明,那么有机制决定哪些样式将被使用. 举例说明,假设有以下三个规则: div#as
SharePoint 2010 中使用Ztree和EasyUI样式冲突问题
<style type="text/css"> /*解决ztree和SharePoint样式冲突问题*/ .ztree li a { display: inline-block !important; padding: 1px 3px 0 0 !important; height: 18px !important; } .ztree li ul { margin: 0 !important; padding: 0 0 0 18px !important; } /*解决tre
[转载]CSS<a href>链接样式冲突解决方法！
给自己这个初学者看的! 原文地址:CSS<a href>链接样式冲突解决方法!作者:叶朗 这里我简要的说一下:关于a href样式冲突 首先我有一个外部CSS样式文件(index.css)里面直接用a:link a:active直接写了 而网站首页和其他栏目页都调用<link href="css/index.css" rel="stylesheet" type="text/css" />,但是我想再在首页加上新的链接并且
css 样式冲突问题
CSS 样式冲突问题 问题: 当文件中样式名称相同时,易出现样式冲突问题,解决办法如下: 解决: 以 layer.js 中弹出层 .layui-layer-page .layui-layer-content 样式为例 源文件 .layui-layer-page .layui-layer-content 样式如下: .layui-layer-page .layui-layer-content{ position: relative; overflow: auto; } 该样式与其他样式冲突时,可
CSS基础概念 第三节 解决样式冲突
在创建一个样式表的过程中,很可能有许多不同的规则将适用于同一个元素.例如,如果一个规则适用于所有的段落元素,另一个规则适用于具有一个具有紧急值的类属性的所有元素,那么应该使用哪一个规则? 当它发生时,这两个规则将适用.如果不同的规则包含处理不同属性的声明,那么就没有冲突,样式都是"组合在一起"的.但是,如果有不同的规则试图为同一个属性设置值的声明,那么有机制决定哪些样式将被使用. 举例说明,假设有以下三个规则: div#aside h1 {color: red; margin: 0.5
css折叠样式（4）——div+css布局
内容概要: 一.div和span (1)块级标签:div (2)内联标签:span 如图所示: 二.盒模型(重要) 注:可用浏览器的调试工具可查看盒子 (1)margin:盒子外边距 (2)padding:盒子内边距(会改变块的大小) (3)border:盒子边框宽度 (4)width:盒子宽度 (5)height:盒子高度 ①:外边距和内边距区别: demo.html <!doctype html> <html> <head> <title>Div+Css
点击div外面该div消失(二)
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript" src="js/jquery-2.2.2.min.js"></script> <style type="text/css">
css样式冲突问题练习例子
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns=" http://www.w3.org/1999/xhtml"><head> <meta http-equiv="Content-
DIV样式汇总
DIV样式汇总 最近在学习JavaScript,在做到个要控制控件样式的例子时,突然有了把常用样式汇总一下的想法,于是乎就写了以下内容,以下是以div为例来汇总的,希望对大家有些帮助. 一.常用属性: 1.Height:设置DIV的高度. 2.Width:设置DIV的宽度. 例: <div style="width:200px;height:200px;"></div> 3.margin:用于设置DIV的外延边距,也就是到父容器的距离. 例: Code 说明:m