使用antd框架时，字体模糊的问题

最新推荐文章于 2024-03-21 19:30:03 发布
最新推荐文章于 2024-03-21 19:30:03 发布
阅读量1.5k 收藏 1
点赞数 1
分类专栏： 前端笔记 文章标签： antd 字体模糊
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/HZZOU/article/details/85269238
版权

最近在写react+antd的项目练手，在使用antd的Card卡片组件时发现在谷歌浏览器手机调试模式时出现字体模糊，使用真机调试也是这样，使用-webkit-font-smoothing也无效，最后逐一排查，发现是Card组件的样式ant-card类上的position:relative属性的影响！看了一下它的子级又没有绝对定位，所以用不上。要覆盖的话，在ant-card类的父级没有定的情况下使用position:inherit

如故
关注
  • 1
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
Ant Design Vue - tabs 组件模糊搜索功能实现
weixin_44800563的博客
09-09 563
<a-input-search placeholder="input search text" style="width: 224px; padding: 10px" @search="onSearch" /> <a-tabs ref="locationsTabs"> <a-tab-pane ref="tabsPane" v-for="(value, key) in locationsData" :key="key.toString()" > &
设置transform导致弹窗字体模糊问题
zzqz的博客
11-19 1559
说明 项目中，设置弹出框居中的时候遇到字体变模糊的情况，查阅资料后发现是transform的问题，下面具体看看： 原因 项目中弹出框的样式居中是这样写的： .box { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } 比如盒子的宽度为300px，高度为401.5px...
antd使用table显示数据出现模糊效果bug
yc__coder的博客
10-14 769
解决方法一： 更改版本，主要是因为antd版本过老，换个版本就好了（这个是百度的，我用最新版的就没问题） 解决方法二： 复写ant样式，随便找一个css格式的样式表中加入下列代码： .ant-spin-container { filter: blur(0px) !important; } 这我就不解释了… ......
android 字体失真,Android 图片及文字模糊效果
weixin_31014131的博客
05-26 452
Gladeimplementation'com.github.bumptech.glide:glide:4.7.1'implementation'jp.wasabeef:glide-transformations:4.0.1'图片模糊使用Glide.with(this).load(url).apply(RequestOptions.bitmapTransform(new BlurTransform...
antd的a-affix切换标签页样式错位问题解决
guochiscoding
11-12 1523
问题描述 我们在满足需要操作吸顶的需求，通常会用到a-affix。这个antd组件可以很方便的满足我们的需求。只要在需要吸顶的部分使用这个组件，并指定容器（详见antd文档=>api=>target)就可以正常使用。但是组件有点小bug，这个bug还蛮容易复现的。我们在切换页面时，会发现affix组件溢出了原容器。官方对此的回答： 发现问题解决方案 这个时候可以发现，当页面开始滚动，则溢出的部分就会恢复正常 解决问题代码 结合上面的想法，我们在页面active的时候，把容器滚动1
react使用antd框架实现按需引入样式不生效问题
weixin_49662044的博客
10-12 752
react使用antd框架实现按需引入样式不生效问题
在umi+react项目下修改antd框架里的组件默认样式
QQ1210611769的博客
08-25 1407
如何修改UI框架里的组件样式目录前言演示说明原理： 目录 前言 如果你发现使用 /deep/ 样式穿透或者 >>> 无法修改，可以使用 :global 来修改，具体使用请查看演示说明 演示说明 比如我现在要修改表格里表头的样式 先找到UI框架写好的表头样式的位置，我这里是 .ant-table-thead > tr > th 然后在它前面加上 :global :global .ant-table-thead > tr > th{ background: #F
实用问题解决之React+antd（1）
随时准备转行
03-21 437
qiankun嵌入子应用后样式隔离、如何实现select+全选功能、useReqeust如何主动触发等问题记录。
在vue项目搭建时使用antd全局修改主题色
weixin_52921391的博客
07-02 5877
我们使用vue做项目时，特别是后台管理系统，大多数都会选择一个ui组件框架 这里以ant-design-vue为例，修改组件的主题色 ant-design-vue上也有定制主题，像这样： 1.因为antd 的样式使用了 Less 作为开发语言，所以我们修改主题色需要下载less和less-loader，注意版本不要太高，容易出问题 建议下载这两个版本，亲测有效 “less”: “^2.7.3”, “less-loader”: “^5.0.0”, 我用的cnpm，没下载淘宝镜像的可以直接npm cnpm i
react+antd搭建后台管理框架
05-20
react+antd搭建前端管理框架（***支持响应式***），主要模块分为：菜单、选项卡、面包屑；通过路由监听，实现三个模块之间的联动（同时监听浏览器）；状态采用react-redux进行集中管理。目前只包含前端代码，未与...
FunSeeAntdBoilerplate:使用Antd框架的管理网站模板项目
05-10
5. **Antd组件**：在项目源码中，你会看到如何使用Antd提供的各种组件，如Form、Table、Button、Modal等。开发者可以通过配置这些组件的属性和方法来实现特定功能。 6. **路由管理**：项目可能使用了如`react-...
antd-bpmn-React框架资源
最新发布
07-01
一个基于 React + Ant.design + bpmn.js 编写的工作流高阶组件。
antd 开发框架包
10-19
antd 开发框架包 1组件化&;antd将UI分成不同的组件,每个组件都独立封装缺陷下面这些都没有:事件系统(除了原生的DOM事件)AJAX功能数据层Promises应用程序架构单单reactjs的代码压缩后也需要147k以上reactjs代码量最多...
react+antd多页面框架
01-08
在搭建和开发React+AntD多页面框架时，开发者还需要熟悉Webpack配置，因为Webpack负责处理模块打包，将JS、CSS、图片等资源转换为浏览器可执行的格式。同时，Babel用于将ES6+语法转换为浏览器兼容的JavaScript。对于...
关于 You cannot set a form field before rendering a field associated with the value
热门推荐
HZZOU的博客
04-05 4万+
前几天在做项目的时候，使用antd做ui,在modal中使用form表单编辑相关信息，modal弹出的时候，form表单里始终不能回调渲染出页面上的信息，报错如标题，意思就是：你不能在页面未渲染之前就进行form表单的相关信息的设置。 在网上查了个遍，也没有找到解决的办法，有人遇到过但也没解决。后来做其他东西时遇到定时器，突然想到延时处理，于是想到了处理办法，延迟0毫秒，问题解决： ...
在react项目中不能直接引入antd.css文件，引入会报警告./node_modules/antd/dist/antd.css (./node_modules/css-loader??ref-
HZZOU的博客
03-24 1万+
解决的方法是在webpack.config.dev.js和webpack.config.prod.js文件添加相关配置,然后引入antd.less： const cssRegex = /\.(css|less)$/; const cssModuleRegex = /\.module\.css$/; const sassRegex = /\.(scss|sass)$/; const sassMo...
关于Gerrit管理使用git push出现 prohibited by Gerrit: ref update access denied
HZZOU的博客
07-11 1万+
需要执行git config remote.origin.push refs/heads/*:refs/for/* 冒号左边的星号为本地仓库的分支名称，for后面的星号为远程仓库的分支名称
Webstorm自动给函数或者代码块添加注释的快捷方法
HZZOU的博客
03-18 1万+
以前给函数添或者代码块添加注释都是一个字一个字的敲，参数啊那些也看的不是很清楚，今天实在是看不下去了，在网上找了半天，大多数都是说的在webstorm的javascript的live templelate下添加模板，但是都不能自动获得参数名称。 但是， 终究还是找到了一个自动获得参数名称添加注释的快捷方法，现在分享给大家： "/**"+"enter"，描述出来意思就是: 左斜杠加两个星号加回...
antd 框架SubMenu 如何使用
04-21
Antd框架的SubMenu可以通过Menu组件的子组件来实现。代码示例： ``` import { Menu } from 'antd'; const { SubMenu } = Menu; <Menu.Item key="1">Option 1 <Menu.Item key="2">Option 2 ...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值