资讯专栏INFORMATION COLUMN

调试DOM元素hover,focus,actived的样式--谷歌浏览器调试器

Yumenokanata / 2079人阅读

摘要:平时写页面代码,给添加一些样式时,我们可以用谷歌浏览器的开发者工具进行调试。

平时写页面代码,给DOM添加一些css样式时,我们可以用谷歌浏览器的开发者工具进行调试。如下图这样:

出现的效果是这样的:

相应的按F12打开Chrome的开发者工具,可以看到相应的样式:

那么关键的问题来了,我想看:hover样式哪里去了?接下来找到并点击这个按钮:

选中:hover,你就能看见你所写的:hover样式了:

相应的火狐浏览器可以这样打开:

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/115103.html

相关文章

  • 四个实用但容易忽略Chrome开发工具特性

    摘要:开发工具是基于浏览器,帮助开发人员调试代码的控制面板。改变元素状态右击元素,会列出功能选项,其中有一项名为,展开子菜单可以看到几种常见的伪类。当尝试改变元素时,给元素添加的断点便会触发。 Chrome开发工具是基于Chrome浏览器,帮助开发人员调试代码的控制面板。它的功能很丰富以至于我们很难面面俱到,这里就有几个不太明显但很实用的功能。 改变DOM元素状态 右击DOM元素,会列出...

    xuxueli 评论0 收藏0
  • 四个实用但容易忽略Chrome开发工具特性

    摘要:开发工具是基于浏览器,帮助开发人员调试代码的控制面板。改变元素状态右击元素,会列出功能选项,其中有一项名为,展开子菜单可以看到几种常见的伪类。当尝试改变元素时,给元素添加的断点便会触发。 Chrome开发工具是基于Chrome浏览器,帮助开发人员调试代码的控制面板。它的功能很丰富以至于我们很难面面俱到,这里就有几个不太明显但很实用的功能。 改变DOM元素状态 右击DOM元素,会列出...

    singerye 评论0 收藏0
  • CSS节选——选择器

    摘要:,,层叠样式表,请留意层叠概念。为了区分伪类和伪元素,伪元素采用双冒号写法。常见伪类。常见伪元素。和伪元素的用法和下特有的,用于在渲染中向元素逻辑上的头部或尾部添加内容。CSS,cascading style sheet,层叠样式表,请留意层叠概念。 css3为了区分伪类和伪元素,伪元素采用双冒号写法。 常见伪类——:hover,:link,:active,:targ...

    番茄西红柿 评论0 收藏0
  • 前端编码习惯 —— css篇

    摘要:使用带前缀的命名空间可以防止命名冲突,同时提高代码可维护性。声明结束每行都应以分号结尾。排查法检查是否正确检查下有拼写错误是否忘记结尾的等。可以利来检查的拼写错误。本是为减肥的具,但也能检查出拼写错误。 ID和Class命名风格 1.id 和 class 的命名总规则为:内容优先,表现为辅。⾸先根据内容来命名,⽐如 main-nav。如 果根据内容找不到合适的命名,可以再结合表现来定,...

    2bdenny 评论0 收藏0
  • 按钮样式正确方式

    摘要:按钮样式的正确方式如果你正在建立一个网站或一个应用,你可能会用到按钮,也许看起来像按钮的链接。这是我们想要做的事情可应用于链接或按钮的按钮样式我们希望有选择地应用它,因为我们的页面中会有其他链接和按钮样式。 按钮样式的正确方式 如果你正在建立一个网站或一个web应用,你可能会用到按钮,也许看起来像按钮的链接。不管怎样,让这些正常展示是很重要的。 在本教程中,我们将为和元素以及一个自定义...

    DataPipeline 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<