首页 > web前端 > js教程 > 正文

html怎么让Chrome支持小于12px 的文字？

韦小宝
发布： 2017-11-29 10:56:14
原创
2014人浏览过

设计师图片上的文字假如是10px，我们实现在网页上之后。往往设计师回来找我们，这个字体能小一些吗？我设计的是10px？为啥是12px?其实我们都知道，谷歌chrome最小字体是12px，不管你设置成8px还是10px，在浏览器中只会显示12px，那么如何解决这个坑爹的问题呢？让我们来看看解决方法吧！

我们的做法是：

针对谷歌浏览器内核，加webkit前缀，用transform:scale()这个属性进行缩放！

代码演示：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<style type="text/css">
			span{
				font-size: 12px;
				display: inline-block;
				-webkit-transform:scale(0.8);
			}
		</style>
	</head>
	<body>
		<span>测试10px</span>
	</body>
</html>
登录后复制

以上就是 html怎么让Chrome支持小于12px 的文字？的所有内容了，更多请到本站搜索更多哦！

相关推荐：

立即学习“前端免费学习笔记（深入）”；

阿里云-虚拟数字人
阿里云-虚拟数字人

阿里云-虚拟数字人是什么？ ...

阿里云-虚拟数字人 2
查看详情 阿里云-虚拟数字人

怎么优化HTML网页

CSS滚动条样式如何兼容IE8和Chrome浏览器？

HTML里的最后一行文字显示不全怎么处理

以上就是html怎么让Chrome支持小于12px 的文字？的详细内容，更多请关注php中文网其它相关文章！

相关标签：
html

大家都在看：

HTML速学教程(入门课程)
HTML速学教程(入门课程)

HTML怎么学习？HTML怎么入门？HTML在哪学？HTML怎么学才快？不用担心，这里为大家提供了HTML速学教程(入门课程)，有需要的小伙伴保存下载就能学习啦！

下载
来源：php中文网
收藏 点赞
上一篇：Jquery对新插入的节点 绑定Click事件失效的解决方法 下一篇：JQuery在循环中绑定事件的问题详解
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系admin@php.cn
作者最新文章
最新问题
JavaScript中的代码分割与动态导入_javascript性能优化 代码分割是将JavaScript打包成多个小文件的技术，通过Webpack等工具实现按需加载；结合动态导入import()语法可延迟非关键资源加载，显著减小首屏体积、提升性能，但需避免过度分割导致请求过多，应合理划分模块并利用预加载优化体验。
2025-11-05 11:15:02
312
JS函数如何定义函数模块导入_JS函数模块导入定义与ES6模块使用教程 JavaScript通过ES6模块实现代码组织与复用，使用export导出函数或变量，import导入模块功能。支持命名导出、默认导出及重命名导入，提升灵活性和可维护性。
2025-11-05 11:02:02
859
JavaScript正则表达式常用技巧总结_javascript技巧 JavaScript正则表达式常用技巧包括：1.使用i、g、m修饰符实现忽略大小写、全局和多行匹配；2.利用\d、\w、\s等预定义字符简化模式；3.通过()捕获分组并用$1引用；4.常见验证如手机号/^1[3-9]\d{9}$/、邮箱、URL等；5.动态构建时用RegExp构造函数并转义特殊字符；6.注意性能，避免过度回溯，推荐使用工具测试。
2025-11-05 10:51:03
219
解决CDN引入React组件不渲染：Babel JSX解析的正确配置 本文旨在解决初学者在使用CDN方式引入React时，组件无法正确渲染的问题。核心在于确保Babel独立脚本能够识别并编译JSX语法。通过为包含JSX代码的标签添加type=‘text/jsx’属性，Babel将自动处理这些脚本，从而使React组件得以正常显示，并提供相关注意事项与最佳实践。
2025-11-05 10:50:20
506
前端JS怎样调用SpringBatch批处理_JS调用SpringBatch批处理服务的详细方法 前端无法直接调用SpringBatch，需通过RESTAPI间接触发。1.后端用Controller暴露接口，注入JobLauncher启动任务；2.前端用fetch或axios发送POST请求调用该接口；3.为处理长任务，后端返回JobID，前端轮询/status/{jobId}获取状态；4.添加SpringSecurity权限控制，防止未授权访问和重复提交。核心是通过HTTP接口桥接前后端，确保安全与状态同步。
2025-11-05 10:47:25
910
JS如何与SpringBoot自定义Starter配合_JS与SpringBoot自定义Starter配合的教程 自定义Starter封装后端通用功能并暴露REST接口，JS通过HTTP请求调用这些接口实现协作。1.创建Starter模块，包含自动配置类、属性类和服务类；2.在主应用引入Starter依赖并配置参数；3.编写Controller暴露API；4.前端使用fetch等方法发送请求获取响应。关键在于前后端分离职责，Starter开箱即用，前端专注接口调用与数据处理，需配置CORS确保跨域访问正常。
2025-11-05 10:45:03
212
JS函数怎样定义函数缓存_JS函数缓存定义与性能优化方法 函数缓存通过存储已计算结果避免重复运算，提升性能。使用闭包与Map缓存参数及结果，如memoize函数对expensiveCalc实现记忆化，减少递归或密集计算开销。
2025-11-05 10:34:02
551
前端性能监控：使用Performance API_js性能优化 PerformanceAPI是浏览器内置的性能监控工具，通过window.performance提供高精度时间戳和页面加载、资源请求等数据。它包含NavigationTiming、ResourceTiming、UserTiming和PaintTiming等接口，可测量页面加载耗时、DOM渲染时间、关键渲染指标如FP和FCP，并支持自定义标记监控函数执行时间。结合PerformanceObserver和navigator.sendBeacon，能实现细粒度性能采集与上报，帮助分析白屏时间、资源阻塞
2025-11-05 10:11:02
871
JavaScript BigInt与数值计算精度 BigInt解决Number类型大整数精度丢失问题，通过加n或BigInt()创建，支持大整数运算但不可与Number混用，适用于高精度场景如ID处理、金融计算，但不支持小数、Math方法及JSON序列化。
2025-11-05 10:05:03
541
JavaScript中的可选链操作符(?.)与空值合并(??)_js ES2020 可选链操作符（?.）允许安全访问嵌套属性，避免读取undefined属性报错，如user.address?.street?.name在中间节点为null/undefined时返回undefined；空值合并操作符（??）仅当左侧为null或undefined时采用右侧默认值，与||不同，能正确处理0、false等假值；两者结合使用可精准处理默认值，如theme=user.settings?.theme??‘dark’，提升代码安全性与简洁性。
2025-11-05 09:37:02
674
相关专题
更多>
热门推荐
开源免费商场系统广告
热门教程
更多>
相关推荐
热门推荐
最新课程
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 意见反馈 讲师合作 广告合作 最新更新 English
php中文网：公益在线php培训，帮助PHP学习者快速成长！
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号

  • PHP学习

  • 技术支持

  • 返回顶部