当前位置: 首页 > 编程日记 > 正文

【html】如何解决标签设置成超链接后字体格式及颜色变化的问题

问题描述:

如图所示,将一个标签设置成超链接后字体颜色和格式会发生改变,如果我只想让它保持原来的格式应该怎么办?

解决方法:

在a标签中添加一个属性:

style="color:inherit;"

添加后的代码:

<a style="color:inherit;" href="product/type/2799-7169-1.html"  id = "topmenu69541"  >关于我们</a>

添加后效果:

可以看到添加改属性后超链接的字体颜色和大小与其他标签字体完全相同

实现分析(inherit属性):

inherit 关键字指定一个属性应从父元素继承它的值。

inherit 关键字可用于任何 HTML 元素上的任何 CSS 属性。

以下面的代码为例:

<div class="child" id="div_69541"><ol id="ol_69541"><a style="color: inherit;" href="product/type/2799-7169-1.html"id="topmenu69780"><li>公司介绍</li></a><a style="color: inherit;" href="product/type/2799-7171-1.html"id="topmenu69782"><li>加入我们</li></a><a style="color: inherit;" href="product/type/2799-7172-1.html"id="topmenu69783"><li>合作伙伴招募</li></a><a style="color: inherit;" href="product/type/2799-7173-1.html"id="topmenu69784"><li>联系我们</li></a></ol>
</div>
<style>
.child {top: 97px;left: -43px;padding: 0px;z-index: 999;width: 150px;border: 1px solid #b5b5b5;
}.child ol {background: #fff;border: none;width: 150px;
}.child ol li {height: 50px;line-height: 50px;border-bottom: 1px solid #b5b5b5;text-align: center;width: 150px;
}.child ol li a {padding: 0;width: 100%;
}.child ol li:last-child {border-bottom: none;
}.child ol li a:hover {color: #fff;background: #205ba3;
}.w_219 h5 label {display: none;
}
</style>

注:<style>中的代码为CSS代码

分析:如果<a>添加该属性后就会强制继承其父标签<ol>的style属性,而<ol>的属性收到了下面css代码的控制,所以最终<a>的属性和其他<li>标签相同

总结:

这里不得不感叹一下inherit属性的强大,之前以我个人的认知我觉得设置成超链接后字体的格式和颜色一定会变,想要和原来保持一致需要使用css代码设置<a>的属性和其他的标签一模一样,对比一下,十分佩服开发者的智慧。天下苦前端三大组久矣?非也!但手不熟尔!

相关文章:

js判断 IE 浏览器

1 $.browser.msie && ($.browser.version 6.0) 转载于:https://www.cnblogs.com/zhupinglei/archive/2012/04/28/2475186.html

UNIX编程笔记:关于停止的进程接收信号的问题

为什么80%的码农都做不了架构师&#xff1f;>>> 因为资料缺少&#xff0c;按照测试得出来&#xff0c;停止状态的进程貌似只对SIGCONT有反应&#xff0c;而别的默认就是忽略。 转载于:https://my.oschina.net/kut/blog/27736

脱壳 VMProtect 1.70.4

【文章标题】: 脱壳 VMProtect 1.70.4 【文章作者】: hxqlky【作者邮箱】: zmunlkygmail.com【作者主页】: http://www.x5dj.com/hxqlky【下载地址】: 自己搜索下载【加壳方式】: VMProtect 1.70.4【保护方式】: VMProtect 1.70.4【编写语言】: MASM32 / TASM32 【使用工具】:…

互联网协议详解

本文转载自&#xff1a;https://www.cnblogs.com/111testing/p/6942585.html 目录&#xff1a;&#xff1a;&#xff1a;&#xff1a;&#xff1a;&#xff1a; 一、网络协议 二、TCP&#xff08;Transmission Control Protocol&#xff0c;传输控制协议&#xff09; TCP头格式…

【java】巨菜博主安装jdk为什么每次都失败?

今天到公司实习第一天&#xff0c;博主兴高采烈地的使用起来的公司配备的电脑&#xff0c;第一步是干啥&#xff1f;当然是安装JDK了&#xff0c;博主平生安装JDK次数数不胜数&#xff0c;但一遍整下来没有任何差错的情况少之又少。今天也不例外&#xff0c;多敲了个空格害我足…

怎么在vs2010中使用ActiveX Test Container(转)

ActiveX Test Container Application is Still Available(转) Hello, I’m Pat Brenner, a developer on the Visual C Libraries team. I’ve noticed some posts on various forums lamenting the loss of the ActiveX Test Container application and I wanted to address …

C#自定义控件四简易时钟

C#自定义控件四简易时钟效果图&#xff1a;简易时钟&#xff0c;顾名思义&#xff0c;简单容易&#xff0c;简单到什么程度呢&#xff1f;界面只有数字和指针&#xff0c;甚至连与当前时间都不能匹配&#xff01;呵呵&#xff01;就这么简单&#xff0c;学习嘛&#xff0c;从简…

GitLab 配置邮箱

设置 SMTP 发送邮件 这里以腾讯企业邮箱为例&#xff0c;其他邮箱可以参考 设置 SMTP 发送邮件。 SMTP 和 POP3/IMAP 协议 SMTP 负责发送邮件&#xff0c;POP3/IMAP 负责接收邮件。其中 IMAP 基本上替换掉了 POP3。 用户在使用客户端&#xff08;例如 Foxmail&#xff09;时&am…

在 Ubuntu Natty 中解除系统托盘限制

在 Ubuntu 11.04 Natty 中&#xff0c;Ubuntu 对顶部面板右上角的通知区域&#xff08;系统托盘&#xff09;采用了白名单制度&#xff0c;只有支持 Indicators 并位于白名单的部分程序才会被显示在系统托盘中&#xff0c;目前支持的程序有&#xff1a; Java apps, Mumble, Win…

Oracle10g客户端远程连接数据库全过程[转]

最近项目用到了oracle&#xff0c;使用的是oracle10g&#xff0c;因为小组内有多人使用数据库&#xff0c;并且oracle数据库很占内 存&#xff0c;就放在单独的一台服务器上&#xff0c;所以最好每个人都装一个oracle10g的客户端。那么客户端到数据库的远 程访问时免不了的了。…

【css】页面出现两个滚动条以及只有一半页面显示内容的解决方法

可能当修改页面的margin等属性时会出现页面只有一半的页面显示内容的情况&#xff0c;此时我们可以修改css代码来解决问题 代码实现&#xff1a; body{overflow:hidden}html{/*overflow-y:scroll;*/ }html{overflow: auto; } 注意&#xff1a;该代码为css代码&#xff0c;需…

Microsoft Dynamics Marketplace

微软对一些产品提供网上销售第三方插件/解决方案的站点叫做 Marketplace&#xff0c;比如 Windows Phone Marketplace, Dynamics Marketplace.这样可以帮助合作伙伴/客户提供一个网上的产品交流平台&#xff0c;Microsoft Dynamics Marketplace 针对微软CRM/ERP 产品&#xff0…

【hdu】4521 小明序列【LIS变种】【间隔至少为d】

题目链接&#xff1a;https://vjudge.net/contest/228455#problem/B 转载于&#xff1a;https://blog.csdn.net/a709743744/article/details/51765252 题目大意&#xff1a; 求最长上升子序列&#xff0c;其中子序列中相邻的两个数的下标差要超过k 解题分析&#xff1a; 子序列…

【bootstrap】bootstrap-4.5.0-example 各个模板展示

前言&#xff1a;博主做前端开发的时候经常用到bootstrap&#xff0c;但挑选模板的时候&#xff0c;需要一个一个的打开文件夹、打开html文件再查看模板是否合适&#xff0c;这样实在有点浪费时间&#xff0c;所以今天博主将各个页面截图展示出来&#xff0c;之后方便大家也方便…

HDU1053 Entropy 哈夫曼树

题目链接&#xff1a;http://acm.hdu.edu.cn/showproblem.php?pid1053 认真读题&#xff0c;别怕题长&#xff0c;此题考查的就是哈夫曼树并求出最小编码值&#xff0c;注意每一次要将数组清0&#xff0c;否则会出错&#xff01; AC代码&#xff1a; #include<iostream>…

C++用数组和链表分别实现Queue

C用数组和链表分别实现Queue 昨天写了《C用数组和链表分别实现Stack》&#xff0c;今天就是《C用数组和链表分别实现Queue》&#xff0c; 队列就是先来的先被处理掉&#xff0c;后来的就等&#xff0c;直到成为先来的&#xff0c;实现起来感觉和栈差不多。 模板好用的&#xff…

bzoj1150 [CTSC2007]数据备份Backup

大概就是写了道生日礼物那个不知道叫啥的贪心。。。。。 大概就是说这道题和那个比较像。。。 所以留着看看吧&#xff0c;哪天想起了回来做这道题咯~ 转载于:https://www.cnblogs.com/LLppdd/p/9051440.html

004本周总结报告

这一周总的来说并没有学到多少东西。只是学习了java数组相关的知识&#xff0c;发现和C/C中的数组基本一样&#xff0c;同时也了解到堆内存和栈内存的概念。在学习数组时发现java数组的length属性很好用&#xff0c;学习了数组的插入赋值&#xff0c;冒泡和选择排序等并用数组的…

JS保留两位小数

JS保留两位小数 对于一些小数点后有多位的浮点数&#xff0c;我们可能只需要保留2位&#xff0c;但js没有提供这样直接的函数&#xff0c;所以我们得自己写函数实现这个功能&#xff0c;代码如下&#xff1a; function changeTwoDecimal(x) { var f_x parseFloat(x); if…

【资源分享】The Beatles(披头士)乐队所有专辑带封面

资源免费分享&#xff0c;送给各位披头士的粉丝。只求个赞可以吗。 复制这段内容后打开百度网盘手机App&#xff0c;操作更方便哦 链接:https://pan.baidu.com/s/1N5BXA18JeaznYhRRy6kiAw 提取码:5439

Serial Communications in Win32

http://msdn.microsoft.com/en-us/library/ms810467.aspx http://hi.baidu.com/beisika/blog/item/b204d58f6c3bece9513d9297.html

platform_driver_register适配的两种方式及probe是否启动与硬件关系

platform_driver_register2种方式学习 1.platform_device_register与platform_driver_register配合使用&#xff1a; 实例代码摘自下述网址&#xff1a; 这样当两个name一样时&#xff0c;就会嗲用mt65xx_leds_probe这个函数了。 static struct platform_driver mt65xx_leds_d…

Java中创建泛型数组

Java中创建泛型数组 使用泛型时&#xff0c;我想很多人肯定尝试过如下的代码&#xff0c;去创建一个泛型数组 T[] array new T[]; 当我们写出这样的代码时编译器会报Cannot create a generic array of T&#xff0c;初学泛型时&#xff0c;看到这个错就以为Java中不能创建泛型…

eclipse假死解决办法

因为要同时开发android&#xff0c;还有毕设要用myeclipse&#xff0c;装了太多插件&#xff0c;eclipse老卡死&#xff0c;解决办法如下&#xff1a; 1、关闭myeclipse的插件&#xff08;开发网页时再打开&#xff09;方法如下&#xff1a; &#xff08;1&#xff09;eclipse-…

Petapoco 连接oracle11g 自动生成poco时遇到的问题

偶尔在园子里看到.net的轻量级ORM框架Petapoco的介绍&#xff0c;觉得很有趣。相关介绍&#xff1a;PetaPoco&#xff1a;适用于.NET的微型ORM 正好最近有个C#Oracle11g的项目&#xff0c;想趁此机会试试用petapoco来做数据层的框架。 在配置步骤和遇到的问题&#xff0c;记录如…

网页分享插件 share.js 国外常用

这两天做推广&#xff0c;要求实现页面分享到国外各大社交媒体的功能。自己去翻各大厂的文档的话&#xff0c;实现起来时间相当长。 github 上找了个插件&#xff0c;很6. 地址&#xff1a; https://github.com/ellisonleao/sharer.js 支持主流的国外的社交媒体的分享。 主要支…

ORM操作models一对多、多对多关系

ORM操作 单表、一对多表操作 1 from django.db import models2 3 4 class UserGroup(models.Model):5 title models.CharField(max_length32)6 7 8 class UserInfo(models.Model):9 username models.CharField(max_length32) 10 password models.CharField(max…

【基础知识】如何快速转发CSDN博客

使用&#xff1a;火狐浏览器、Markdown编辑器 一、打开要转发的博客、按F12并点击查看器 二、复制页面的代码&#xff08;此处用到一个小技巧&#xff09; 1、鼠标点击该按钮 2、将鼠标放到图示位置&#xff0c;使变色的位置覆盖所有博客的内容后点击鼠标左键 3、看到下方代码…

SQLServer 系统表

SQLServer 系统表 http://blog.163.com/zangyunling126/blog/static/1646245052010101641620415/ http://www.cnblogs.com/yolion/archive/2007/10/08/916767.html SQL系统表说明 http://hi.baidu.com/etimeman/blog/item/3d5d82fc09bbfff8fc037fae.html SQLServer系统表详细说…