如何写好一个字 & 有效的在 css 栅栏布局中优化排版?

发布于 2022-09-06 13:18:02 字数 570 浏览 23 评论 0

1.目的

在优化系统面板的时候发现一个很苦恼的问题,可见图一:
One
图一:错乱的排版,字体采用了固定的大小。

那么如何使用 CSS 的相关知识,优化字体大小与栅格排版,使其能像图二一样,同时可自缩放,满足于不同屏幕浏览?

2.参考图
Two

3.思路

  • REM + @media
  • Bootstrap 4 优化了栅格,能满足现在的要求。但是在有效的周期内进行网站大幅度的修改是不可行的。

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(4

轻许诺言 2022-09-13 13:18:03

两个思路:1、最后一栏定宽 2、js控制样式

紫轩蝶泪 2022-09-13 13:18:02

一定要全部显示?可滚动不行么?

一刻暧昧 2022-09-13 13:18:02

这一行用 flex 岂不是更好?

伪心 2022-09-13 13:18:02

项目用的是bs3?是的话找个px->rem的工具把它的主css喂进去,吐个rem版的出来就可以初步支持缩放了,当然后边还得再自己写点乱七八糟的,比如如果想做高分屏支持就得单独加套DPR规则(这个好像到bs4也没支持。。?)。
原则上不支持字体写动态,当然有需要也可以变通。。。。

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文