它由9个框组成,中间带有文本。我已经制作了框,以便它们可以随着屏幕大小的变化而调整大小,以便始终保持在同一位置。

但是,即使我使用百分比,文本也不会调整大小。

如何调整文本的大小,使其在整个页面上始终具有相同的比例?

这是处理多种分辨率的合适解决方案吗?还是我应该@media在CSS中进行很多检查并为每种媒体类型设置许多布局?

```

html,

body {

height: 100%;

width: 100%;

}

#launchmain {

width: 55%;

display: inline-block;

position: relative;

top: 10%;

left: 25%;

}

#launchmain:after {

padding-top: 79.26%;

display: block;

content: '';

margin-top: 10px;

}

#box1 {

border: 1px solid #000000;

position: absolute;

width: 25.37%;

height: 21.88%

}

#box2 {

border: 1px solid #000000;

width: 48.48%;

height: 21.88%;

position: absolute;

left: 25.64%

}

#box3 {

border: 1px solid #000000;

width: 25.37%;

height: 21.88%;

position: absolute;

left: 74.39%;

}

#box4 {

border: 1px solid #000000;

width: 33.235%;

height: 53.84%;

position: absolute;

top: 22.07%;

}

#maininvite {

border: 1px solid #000000;

width: 33.53%;

height: 53.84%;

position: absolute;

top: 22.07%;

left: 33.235%;

}

#box6 {

border: 1px solid #000000;

width: 33.235%;

height: 53.84%;

position: absolute;

top: 22.07%;

left: 66.765%;

}

#box7 {

border: 1px solid #000000;

width: 25.37%;

height: 21.88%;

position: absolute;

top: 76.2%;

}

#box8 {

border: 1px solid #000000;

width: 48.48%;

height: 21.88%;

position: absolute;

left: 25.64%;

top: 76.2%;

}

#box9 {

border: 1px solid #000000;

width: 25.37%;

height: 21.88%;

position: absolute;

top: 76.2%;

left: 74.39%;

}

#maininvite h2 {

font-size: 180%;

}

p {

position: relative;

font-size: 80%;

}

header

not a lot of text here but still overflowing

```

div怎么在css中设置字体大小,根据div大小调整字体大小相关推荐

  1. div怎么在css中设置字体大小,div字体大小设置 css设置div中字体大小尺寸样式

    div字体大小设置 css设置div中字体大小尺寸样式设置篇 在css div布局中常常对div字体大小设置,这篇ThinkCSS为大家介绍div中字体大小尺寸样式设置,通过直接在div标签加字体大小 ...

  2. div怎么在css中设置字体大小,css如何设置div字体大小

    css设置div字体大小的方法是,给div字体添加font-size属性,并且设置合适的字体大小即可,例如[div {font-size:200%;}]. 本文操作环境:windows10系统.css ...

  3. css中字的大小,字体大小大于CSS中设置的大小

    当我将字体大小设置为特定像素高度时,计算出的字体大小是我在CSS中设置的大小的1.333倍.但是,如果我将字体大小设置为百分比,则使用正确的大小.这种情况发生在我尝试的每个浏览器中,包括Firefox ...

  4. html怎么设置字体于字体的间隔,如何在css中设置字体间隔

    如何在css中设置字体间隔 发布时间:2021-05-15 15:39:05 来源:亿速云 阅读:81 作者:Leah 如何在css中设置字体间隔?针对这个问题,这篇文章详细介绍了相对应的分析和解答, ...

  5. css 2倍行距,如何在css中设置行间距

    如何在css中设置行间距 发布时间:2021-04-29 15:36:12 来源:亿速云 阅读:63 作者:Leah 如何在css中设置行间距?相信很多没有经验的人对此束手无策,为此本文总结了问题出现 ...

  6. 如何在 CSS 中设置组件在浏览器屏幕水平垂直居中

    如何在 CSS 中设置组件在浏览器屏幕水平垂直居中   在 CSS 中设置组件在浏览器屏幕水平垂直居中可分解为两个问题,一是设置组件在其父组件的水平垂直居中,二是让其父组件铺满整个屏幕.   对于让最 ...

  7. css中设置微软雅黑时,在ie6css中有些样式会失效的解决办法

    最近做专题页面时发现在css中设置{font-family:"微软雅黑";} 时,在ie6中会使一些样式失去作用,或者出现页面变形,尝试着用办双引号去掉或者把 字体设置成font- ...

  8. 为什么在css中设置了font-family: 微软雅黑没有用

    首先可以用 { font-family: 微软雅黑: } 如果这样不行还可以用: { font-family: "Microsoft YaHei" ! important; } 使 ...

  9. html img图片不平铺,如何在css中设置图片不平铺

    如何在css中设置图片不平铺 发布时间:2021-04-29 15:39:28 来源:亿速云 阅读:80 作者:Leah 这篇文章将为大家详细讲解有关如何在css中设置图片不平铺,文章内容质量较高,因 ...

  10. css中设置了font-family: 微软雅黑没有用

    首先可以用 {font-family: 微软雅黑: } 如果这样不行还可以用: {font-family: "Microsoft YaHei" ! important; } 使用中 ...

最新文章

  1. Elasticsearch内存分配设置详解
  2. python range从大到小排列_python 十大经典排序算法
  3. 【转】CLASS ALV(CL_GUI_ALV_GRID) 添加保存布局(Save Layout)的按钮
  4. 【NLP】Transformer的中年危机?
  5. ubuntu不显示壁纸,桌面右键无反应
  6. delphi——用线程创建一个窗体笔记
  7. python记录(4)- lxml模块创建xml文件
  8. AndroidStudio安卓原生开发_activity之间复杂对象类型的数据传递---Android原生开发工作笔记92
  9. MySQL:浅析 Impossible WHERE noticed after reading const tables
  10. 无重复字符最长字串的滑动窗口结合哈希表解法(注释详尽)
  11. codeforces 460C - Present 二分加模拟
  12. 配置mysql字符_mysql字符设置
  13. php网站整合ck播放器,CKplayer 整合播放M3U8视频
  14. 中国农业大学计算机研究生专业课,中国农业大学2019计算机考研纯干货分享
  15. 遥感软件显示影像名称-影像挑选查看等操作
  16. Android 静默安装的几种方式
  17. python爬虫豆瓣高分电影前一百部
  18. 一篇网络流的好blog
  19. 基于LXC的GPU服务器搭建
  20. 最出色的员工往往最先离职,却不是因为钱,到底为什么?

热门文章

  1. 支付宝APP退款功能开发
  2. HBase Java API操作数据库
  3. 北京化工大学计算机考研资料汇总
  4. git 如何把develop分支代码合并到master主分支
  5. AtCoder Beginner Contest 164 E Two Currencies Bellman-Ford优化思想+01背包+动归dp状态转移
  6. 企业微信小程序-获取员工信息
  7. java二维数组货柜,装箱布局三维可视化控件开发sup*/sup
  8. stm32f7网口_【STM32F7】开发篇 - 详解STM32F7 TCPServer工程【申精】
  9. Hadoop是什么,能干什么,怎么使用
  10. 【NOI2012】骑行川藏