为什么CSS代码不起作用

本文介绍了为什么CSS代码不起作用的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！ 问题描述 29岁程序员，3月因学历无情被辞！ 大家好，我有这个HTML代码 < div id = 向下箭头 > < / div > 代码工作正常，我称之为< DIV>在名为 custom.css 的文件上使用css。 这是造型代码; div ＃ arrow-down { width ： 0; height ： 0; border-left ： 40px solid transparent; border -right ： 40px solid transparent; border-top ： 40px solid＃2e3192; margin ： 0％46％; } CSS代码工作正常，它会创建一个面朝下的箭头。问题出现在以下代码中 @ media 所有 和 （max-width： 768px）{ div #arrow-down { display ： 无！important ; } } i希望在移动设备上查看时不显示箭头（div） 。当我在浏览器（开发人员工具）上测试代码时，代码似乎有效，但由于某些原因，当我将代码保存在 custom.css 文件中时代码不起作用，箭头仍然可见。 br /> 我尝试过： 以下是备用代码列表我试过了 @ media all 和 （max-width： 768px）{ div＃arrow-down { 可见性 ： 折叠！important ; } } @ media all 和 （max-width： 768px）{ div #arrow- down { 可见性 ： hidden ！important ; } } @ media all 和 （max-width： 768px）{ div＃arrow-down { border-top ： 0px solid＃2e3192; ！important; } } 所有这些代码当我在浏览器（开发人员工具）上测试它时工作，但是当我将它保存在 custom.css 文件中时不工作。 我缺少什么？解决方案 此代码适合我的情况。 您也可以尝试删除'div' #arrow-down { 宽度：0; 身高：0; border-left：40px实心透明; border-right：40px实心透明; border-top：40px solid＃2e3192; 保证金：0％46％; } 这也有效。 Hi guys, i have this HTML code <div id="arrow-down"> </div>the code works fine and i styled the <DIV> using css on a file named custom.css.Here is the styling code;div#arrow-down { width: 0; height: 0; border-left: 40px solid transparent; border-right: 40px solid transparent; border-top: 40px solid #2e3192; margin: 0% 46%;}The CSS code works fine, it creates an arrow facing down. the problem comes in the following code@media all and (max-width: 768px) {div#arrow-down { display: none !important; }}i want to make the arrow(div) to not display when being viewed on mobile devices. The code seems to work when i test it on the browser (developer tools) but for some reason the code does not work when i save it in the custom.css file, the arrow is still visible.What I have tried:Here is a list of alternate codes that i tried out@media all and (max-width: 768px) {div#arrow-down { visibility: collapse !important; }}@media all and (max-width: 768px) {div#arrow-down { visibility: hidden !important; }}@media all and (max-width: 768px) {div#arrow-down { border-top: 0px solid #2e3192; !important; }}all these codes work when i test it on the browser (developer tools) but not when i save it in the custom.css file.what am i missing? 解决方案 This Code was Working for my case.you can also try to remove 'div'#arrow-down { width: 0; height: 0; border-left: 40px solid transparent; border-right: 40px solid transparent; border-top: 40px solid #2e3192; margin: 0% 46%;}this was also working. 这篇关于为什么CSS代码不起作用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！ 上岸，阿里云！