html - 我的浏览器不会根据我的 CSS 样式表更改网站

标签 html css browser

我真的不知道该怎么办。 当我更改 CSS 时,我的浏览器没有改变

情况是这样的: 我在 CSS 和 html 中有一个名为 wraper 的类,这个类是一个 div 包装 2 个子 div 我对这个类应用了display : none,所以这个类应该是不可见的,但实际上div是可见的

所以我检查了元素,我发现 div 在浏览器控制台中没有类,只有用户代理样式表

截图如下:

CSS

browser console

div class='wraper' 只有用户代理样式表,即使我将高度和宽度设置为 900px 和 300px,当我检查 div 时有 1343px x 0px

HTML 的结构是这样的:

<div class='wraper'>
<div class='gambar-testi'></div>
<div class='preview-testi'><h2> Testimoni</h2>
<span>Lorem ipsum dolor sit amet, consectetur 
adipiscing elit. Pellentesque erat ex, dapibus sit 
amet lobortis eget, consequat vel nisi. Aliquam ac 
enim eget libero pretium venenatis id sed nibh.</span></div>

和 CSS:

.wraper {
width : 900px;
height : 300px;
display : none;
}
.gambar-testi {
display : inline-block;
margin : 10px;
background-color : red;
width : 47%;
height : 340px;
}

.preview-testi {
width : 47%;
display : inline-block;
margin : 0 30px;
}
.preview-testi span {
font-size : 30px;
}

另一个问题,我刚才将 .gambar-testi 属性从 float : left 更改为 display : inline-block 我在浏览器控制台中检查该元素,它显示该属性仍为 float : left 尚未更改为 display : inline-block

enter image description here

.wraper {
	width : 900px;
	height : 300px;
	display : none
}
.gambar-testi {
	display : inline-block;
	margin : 10px;
	background-color : red;
	width : 47%;
	height : 340px;
}

.preview-testi {
	width : 47%;
	display : inline-block;
	margin : 0 30px;
}
.preview-testi span {
	font-size : 30px;
  color : black;
}
<html>
  <head></head>
  <body>
<div class="wraper">
	<div class="gambar-testi"></div>
	<div class="preview-testi"><h2> Testimoni</h2>
	<span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque erat ex, dapibus sit amet lobortis eget, consequat vel nisi. Aliquam ac enim eget libero pretium venenatis id sed nibh.</span>
  </div>
</div>
    </body>
  </html>

我也试过 Jsfiddle 来重现问题,但结果没有显示在这里是链接:https://jsfiddle.net/xqxkzhfL/

也尝试在 SO 代码片段中创建它,但结果并没有显示太多 请帮助我已经不知道该怎么办了......这是我目前所知道的一切

编辑 抱歉,我是愚蠢的,在 jsfiddle 和 SO 代码片段中,我将 display : none 应用于 .wraper 所以当然不会显示结果,因为显示没有... 是的,它在 jsfiddle 和 SO 代码片段中有效,但在我的本地主机中它不起作用......为什么?

最佳答案

请确保您的浏览器不会缓存您的旧网页 在chrome中,保持“开发者控制台(F12)出现,然后设置->网络->禁用缓存(当DevTools打开时)enter image description here

关于html - 我的浏览器不会根据我的 CSS 样式表更改网站,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41234250/

相关文章:

javascript - React-dropzone 样式拖放区

html - 悬停时的过渡效果

javascript - 使用 style.left 从右向左移动图像

javascript - 单击特定按钮时如何显示 div,

html - 我的 jQuery 代码不再适合 jQuery 1.9.on。有人告诉我我现在该怎么办?

html - 如何使 html5 slider (输入类型 ='range')在 Firefox 中工作

javascript - 更改背景不适用于所有浏览器

javascript - 1像素Gif作为新的测量工具? o_O BLANK_IMAGE_URL 是做什么用的?

CSS3 font-face ...如何制作字体样式 :italic to use the actual italic version?

SmarTvs中的浏览器: Which engine do they use?