css 怎么覆盖框架样式

理解这标题就一句话：自己写个class样式覆盖到框架的样式位置就好了。

1.自定义图标替换ionic图标样式

<ion-item class="item item-complex my-complex item-icon-left item-icon-right"><a class="item-content my-content" ng-click="goPage('archive', '个人信息')"><i class="icon datum-img"></i><span style="font-size: 90%;line-height:inherit">个人信息</span><i class="icon ion-ios-arrow-right msgText" style="font-size: 20px;"></i></a></ion-item>

.datum-img{/* 个人信息*/background: url(../img/mine/datum.png) no-repeat center;width: 20px;height: 20px;margin-top: 3px;display: inline-block;background-size: 100%;
}

.my-complex .my-content{padding: 10px 0px 10px 0px;
}

从代码中可以看到，.datum-img是使用自定义图标，宽高大小需要明确指出。而下面 .my-complex .my-content的样式内容是覆盖掉框架的.item-complex .item-content中padding的规格，而其他规格没写则还是以框架原有的规格显示。图标大小可以用font-size来调整。

总结：覆盖样式，1、先看下框架css的层次，2、依据框架层次自己写个不同名的class样式，样式内含有你需要覆盖的规格key要对，然后自己改想要的value。3、把自己写好的class样式名写到你需要覆盖的框架样式后面就能实现覆盖了。而且不会对原有的框架样式发生改变。

css 怎么覆盖框架样式相关推荐

10个顶级的CSS UI开源框架
随着CSS3和HTML5的流行,我们的WEB页面不仅需要更人性化的设计理念,而且需要更酷的页面特效和用户体验.作为开发者,我们需要了解一些宝贵的CSS UI开源框架资源,它们可以帮助我们更快更好地实现 ...
HTML、CSS 和 JS框架之Bootstrap
阅读目录一.Bootstrap简介: Bootstrap 是最受欢迎的 HTML.CSS 和 JS 框架,用于开发响应式布局.移动设备优先的 WEB 项目. 详细参考内容:Bootstrap_v3 ...
JQuery中.css()与.addClass()设置样式的区别
对于样式的设置,我们学了addClass与css方法,那么两者之间有什么区别? 可维护性: .addClass()的本质是通过定义个class类的样式规则,给元素添加一个或多个类.css方法是通过Ja ...
php 无法加载css文件,解决ThinkPHP样式无法加载问题（CSS,JS）,
解决ThinkPHP样式无法加载问题(CSS,JS)解决了ThinkPHP风格无法加载的问题(CSS,JS),以下是thinkphp框架教程栏目,对ThinkPHP风格无法加载(CSS,JS)问题的解 ...
css如何调整红心样式_在JavaScript应用程序中包含CSS的多种方法「渡一」
原文链接:https://css-tricks.com/the-many-ways-to-include-css-in-javascript-applications/,作者:Dominic Magn ...
CSS分别设置Input样式（按input类型
CSS分别设置Input样式(按input类型) 当你看到<input>这个html标签的时候,你会想到什么?一个文本框?一个按钮?一个单选框?一个复选框?--对,对,对,它们都对.也许你 ...
2016年 CSS 库、框架和工具新生榜 TOP 50
CSS 于 2016 年发布的开源项目,其产量之大超出人们的预料,但纵观 CSS 在过去几年的巨大变化与快速发展,此结果的出现似乎又在情理之中.这些 CSS 库.框架和工具的建立不仅给我们提供了学习的 ...
css 默认显示滚动条,css控制默认滚动条样式
针对webkit内核的浏览器,使用伪类来改变滚动条的默认样式,详情如下: 滚动条组成部分 1. ::-webkit-scrollbar 滚动条整体部分 2. ::-webkit-scrollbar-t ...
店铺首页图片css,店铺装修-CSS中的背景样式
本篇教程学习的是店铺装修-CSS中的背景样式,喜欢的一起来学习吧. 那我们开始今天的教程吧. 1.在[窗口]-[CSS设计器]添加[在页面中定义],添加一个新的类,[布局]里面有两个重要的东西,一个是 ...

css 怎么覆盖框架样式

css 怎么覆盖框架样式相关推荐

最新文章

热门文章