ng-zorro等组件默认样式的修改
https://www.jianshu.com/p/8b887c2aac06
在项目中修改ng-zorro组件默认样式的一些方法:
- 类名等 前加
::ng-deep; - 类名等 前加
:root; - 类名等 前加
:host /deep/;
::ng-deep .ant-spin-dot i {
background-color: #4c7bff;
}
:host ::ng-deep .ant-spin-dot i {
background-color: #4c7bff;
}
:root .ant-select-dropdown {
background-color: #1F273E;
font-size: 14px;
margin-top: 16px;
}
:host /deep/ .ant-spin-dot i {
background-color: #4c7bff;
}
注意:上面三种方法可分别尝试一下,不同情况下其中之一会生效。
截止目前最新的7.0.0-rc.0 版本
table组件tbody中的td中的内容超出时默认会换行,想要实现xxxx...的效果需要一个hack:
::ng-deep .ant-table-tbody > tr > td {
max-width: 0;
white-space: nowrap;
}
作者:tiger亮
链接:https://www.jianshu.com/p/8b887c2aac06
来源:简书
简书著作权归作者所有,任何形式的转载都请联系作者获得授权并注明出处。
ng-zorro等组件默认样式的修改的更多相关文章
- Ionic4.x Theming(主题) 增加内置主题 颜色 修改内置组件默认样式 修改底部 Tabs 背景颜色以及按钮颜色
1.Ionic4.x Theming(主题) Ionic4.x 修改主题颜色的话需要在 src/theme/variables.scss 文件中修改. https://ionicframework.c ...
- Vue中修改组件默认样式
vue 中直接使用 class 修改组件的默认样式,在使用 scoped 之后,样式是没有效果. 此时可以使用div 包裹组件,deep 可以实现修改组件样式 .lxfix /deep/ .contr ...
- 更改微信小程序的组件默认样式
checkbox /*checkbox 整体大小 */ .checkbox { width: 12%; /* height: 240rpx; */ } /*checkbox 选项 ...
- element-ui默认样式修改
来自 :https://blog.csdn.net/wangguoyu1996/article/details/81394707 侵删 我们在使用element-ui的时候经常会遇到需要修改组件默认样 ...
- js自定义修改复选框单选框样式,清除复选框单选框默认样式
之前做项目的时候,也遇到过需要按照设计稿把<input type="checkbox">和<input type="radio">的默认 ...
- css去除webkit内核的默认样式
做移动端的朋友应该知道,iphone的默认按钮是个很恶心的圆角,select下拉框也有默认样式无法修改. 这时候可以用到 -webkit-appearance:none //去除默认样 在按钮和sel ...
- 【转】html5中如何去掉input type date默认样式
html5中如何去掉input type date默认样式1.时间选择的种类:HTML代码: 选择日期:<input type="date" value="2017 ...
- html5中如何去掉input type date默认样式
html5中如何去掉input type date默认样式 1.时间选择的种类: HTML代码: 选择日期:<input type="date" value="20 ...
- Vue——解决使用第三方组件库时无法修改默认样式的问题(使用 /deep/ )
最近在开发一个基于Vue的后台管理系统,其中使用了element-ui第三方ui组件库.使用过组件库的人都知道,第三方组件往往会有一些默认的样式,而有些又是我们想要改变的. 一.基础(了解 <s ...
随机推荐
- EOS dice移到1.8版本的修改汇总
EOS dice移到1.8版本的修改汇总 1. CORE_SYMBOL 被去掉了,需要自己在文件中声明eg: uint64_t string_to_symbol_c(uint8_t precision ...
- Confluence 6.15 附件(Attachments )宏
附件宏显示添加到一个页面中的所有文件列表. 同时附件宏允许用户(用户需要具有正确的权限)来进行下面的操作: 直接从列表中上传一个文件到页面 编辑附件属性和标签 删除一个附件文件(这个将会删除文件的所有 ...
- less命令:查看文件内容
less 命令的作用和 more 十分类似,都用来浏览文本文件中的内容,不同之处在于,使用 more 命令浏览文件内容时,只能不断向后翻看,而使用 less 命令浏览,既可以向后翻看,也可以向前翻看. ...
- 「CF442C」 Artem and Array
题目链接 戳我 \(Solution\) 观察发现如果一个数两边都比他大,删掉他可以保证最优,这个应该是显然的.这个东西用单调栈维护一下,最后剩下的就是个单调递减或单调递增的数列,从小到大排个序取前面 ...
- SpringSecurity开发
RBAC 数据库权限表结构设计与创建 sys_user表 CREATE TABLE sysuser (id INT(10) unsigned PRIMARY KEY NOT NULL COMMENT ...
- CSS、Bulma介绍
文章目录 一.序章 二.CSS 基础 1. CSS 介绍 2. CSS 语法 3. CSS常用元素 1.颜色 2.字体大小 3.宽高 4.盒模型(单独拿出来讲) 5.背景 4.1样式和内容分离 4.2 ...
- jdk git maven Jenkins的配置
前言 搭建Jenkins的笔记. JDK 1. jdk 下载地址 https://www.oracle.com/technetwork/java/javase/downloads/jdk8-down ...
- 卸载阿里云盾(安骑士)监控&屏蔽云盾IP
卸载阿里云盾监控 wget http://update.aegis.aliyun.com/download/uninstall.sh chmod +x uninstall.sh ./uninstall ...
- 移动App双周版本迭代策略
对于移动互联网产品来说,迭代的速度就是生命.我创业时做移动App时是一周一版,而现在是2周1版.相比起小公司,大公司迭代时间虽长,却更为不易,因为大公司流程更多,参与人数更多,需求更多,实现这样的快速 ...
- Mongdb、Mysql、Redis、Memcache场景
个人的一点理解,不确定一定准确,有不对处欢迎指出 全部数据使用mysql存储,确保安全.准确和持久 大数据.非安全性数据使用Mongodb 小数据.结构丰富.持久化(主从数据)使用redis 小数据. ...