首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

给定设计的html字号基数是多少(1920px X 1080px)?

给定设计的html字号基数是多少(1920px X 1080px)?

根据给定的设计尺寸1920px X 1080px,字号基数的选择可以根据具体需求和设计风格来确定。一般来说,常见的字号基数选择是16px或者14px。

16px是较为常见的字号基数,适用于大部分网页设计。它可以提供良好的可读性和用户体验,并且在不同设备上显示效果较为一致。

14px是一种较小的字号基数,适用于特定设计需求,例如需要在有限的空间内显示更多内容的情况下。但需要注意的是,较小的字号可能会影响可读性和用户体验,因此在使用时需要谨慎考虑。

根据具体设计需求,可以在CSS中设置字号基数,例如:

代码语言:txt
复制
html {
  font-size: 16px;
}

以上代码将字号基数设置为16px,然后可以在其他元素中使用相对单位(如em或rem)来定义具体的字号大小。

对于腾讯云相关产品和产品介绍链接地址,由于要求不能提及具体品牌商,无法提供相关链接。但腾讯云提供了丰富的云计算服务,包括云服务器、云数据库、云存储等,可以根据具体需求选择适合的产品。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

如何写自适应分辨率的网页

这种写法也可以用在PC端,有时候设计按照1080P设计,用户使用的时候放在小屏幕上看就出现很多样式改变或者被压缩换行,界面适配比较不好做的时候,也可以使用等比缩放。...等比缩放最初我是用css的rem来做的,那会儿单纯的写h5,用px的话,手机显示屏分辨率不一样,用px做单位很难适配,用百分比的话,开发的时候真的要疯了,得按照设计图一个单位一个单位去算。...后来想到了用css的rem做单位,只要保证根节点(HTML根元素)的字号不变,之后所有的页面按照rem为单位来写,那么在分辨率改变的时候,动态的调整根节点的字号大小,就可以做到适配。...还需要注意的是,需要设置相对尺寸。这个尺寸最好是按照设计图来,这样做出来的东西和设计图才可以1:1还原。...如下: 蓝湖可以设置相对单位比例,设置好就可以直接获取相对单位(假如设计图是1920px*1080px)。

2.6K20
  • px转vw和vh的工具(对前端同学有用)

    假如说有一个设计师做了一张1136x750px的页面,这长页面是针对iPhone6的屏幕设计的。...换句话说, 不管是1136x750px的屏幕还是960*640px或着其他的尺寸的屏幕,它们的宽度都是100vw,高度都是100vh。...但是, vw和vh和百分比最大的差别在于,百分百是相对于父元素的, vw和vh则是相对与根元素的,更确切一点是 window.innerWidth 和 window.innerHeight 这给html...设置自适应尺寸提供了很大的便利,要为html文档树某处枝叶的一个元素设置相对于屏幕的百分比,在以前, 只能用JavaScript动态计算,现在使用vw和vh两个单位就可以解决问题。...假定有一张psd设计稿, 宽度为1920px, 高度为1080px, 设计稿中有一个按钮, 宽为100px, 高位40px, 如何把这个按钮的宽高从px转换为vw和vh。

    4.9K80

    花10分钟用Vue 实现 1 个数字滚动效果

    前言 快要双十一了,然后公司要制作一个展示的电子大屏,其中总金额的数字需要滚动的切换效果,类似于这样: 动画.gif 2....思考&实现 2.1 思考 诶,作为十年代码经验常年摸鱼的我,想起来vue中的transition-group可以实现类似的效果,首先来看看官网的案例[1]效果: 2.gif 2.2 实现 于是我们先参照官网实现一个简单的效果...DOCTYPE html> html lang="en"> X-UA-Compatible...{ min-width: 1920px; min-height: 1080px; width: 100%;...> 复制代码 现在离完整的效果,其实只差一步了,现在由于原来的数字会占用空间,所以导致离开的和进入的没有在同一直线上,所以,我们加上position:absoulte,再使用left定位将它们固定在合理的位置上

    2.4K10

    适配完结篇三 - 超稳定的values-wXXXdp适配方案(原创)

    _的方案: 假设现在的UI设计图是按照480份数*320份数设计的,且上面的宽和高的标识都是px的值,你可以直接将px转化为x[1-320],y[1-480],这样写出的布局基本就可以全分辨率适配了。...还需要考虑哪些因素呢, 比如得考虑平板的虚拟按键栏, 所以还得采集具体设备的参数 例如平板M2 PLE-703L 在横屏状态下为1920px = 768dp, 但是如果有了虚拟按键, 则只剩下1830px...团队有没有专门针对平板设计UI?...平板由于屏幕大应该显示更多的内容, 这就要求要设计1套以上的布局很费事. 对UI的要求页很高. 这样而言如果没有特殊的要求, 还不如手机版的一维数组再一股脑加上 Pad版的一维数组靠谱....需要选取以一个屏幕分辨率作为基板, 建议1920px*1080px为基准 缺点是还得穷举所有已知屏幕的宽度, 如果各家安卓厂商的有虚拟按键, 宽度则需要适当减少一些像素, 这会导致可能没有对应的w

    69520

    网页设计有什么标准?细说网页设计的6大规范

    )、MacBook Pro15(2880x1800px)、iMac 27(2560x1440px)等,这些是主流尺寸,如果做网站时建议按主流的分辨率1920x1080px来设计,通常设计网站时的网站宽度为...1920px,每个屏幕的高度约为900px。...另外,字号的大小也非常重要。网页的显示区域决定了文字不可以过大,在网站设计中文字大小一般来说是12-20像素。为什么不能比12px更小?因为如果比12像素更小的中文无法放得下复杂的笔画了。...而且奇数的文字表现和适配都不好做,也就是说我们必须使用偶数的字号来设计。那么总结一下:文字使用宋体、大小为12px、渲染方式选择无。...参考链接: https://www.youhuaxing.cn/seojianzhan/17709.html

    3.4K60

    B端原型设计太复杂?看这一篇轻松入门

    做好B端原型设计时可以按照一定的方法论,通常来讲,B端原型设计可以通过流程与功能来进行设计,功能模块就是页面布局的基础,流程则是交互设计的基础。...原型设计规范是一套规范原型图的标准,它可以确保产品设计的一致性和可用性,还能提升产品经理画原型图的效率。B端产品专业化要求很高,在设计原型的过程中需要高度遵循设计规范,避免产生需求不严谨的问题。...以下是常见的B端原型设计规范,大家在制作B端原型的时候,可以作为设计参考:界面尺寸:网页端一般都是1920px*1080px,1440px*900px和1366px*768px。...字号上,一级标题大小24px,二级标题大小20px,除了标题,其他字号普遍是14字号。此外,汉字通常采用左对齐,行高可以是文字大小+8px。...有一个规律,就是尺寸的设定为偶数,且最好是以4px为基数。响应式设计:考虑不同设备和屏幕尺寸上的响应式设计,确保页面在各种设备上自适应和呈现良好,规定断点、内容隐藏和重排等响应式策略。

    1.1K30

    【融职培训】Web前端学习 第2章 网页重构18 rem布局

    首先考虑一个问题,rem的参照物是html元素的font-size属性,那么如果html的font-size属性不变的话,我们使用的rem单位仍然是一个固定的单位,所以我们需要做的是让html元素的font-size...四、设计稿量尺 我们再从web开发流程的角度来看,为什么rem布局比百分比布局更加简便,使用rem布局的流程如下所示: 首先,我们拿到设计师的设计稿,通常设计稿的宽度为640px、720px、1080px...然后再来看看我们的fontsizeset.js文件中的一段代码,第二个数字720就是设计稿的宽度,如果设计稿是1080px,我们需要将fontsizeset.js中的720改成1080。...1 docEl.style.fontSize = 100 * (clientWidth / 720) + 'px'; 最后量尺的时候,如果设计稿中的元素尺寸为x,那么元素的尺寸我们就可以设置成x/100rem...我们引入的js文件是720px的设计稿,那么假如设计稿中有一个360px的元素,则该元素广告就是原设计稿的一半,这样我们通过换算可以得到这个元素在网页中的尺寸是3.6rem,所以当我们设置成3.6rem

    45010

    基于VUE + Echarts 实现可视化数据大屏展示效果

    中国(寿光)国际蔬菜科技博览会智慧农业系统 — LED拼接屏展示前端开发文档 上线后呈现效果: 一、开发需求及方案制定 1、确定现场led拼接屏的宽高比,按照1920px*1080px的分辨率...,F11全屏后刚好占满整屏且无滚动条; 2、与产品设计确定页面相关功能: 第一屏相关功能:实时时间、当地天气、菜博会基本信息、图表数据统计(近三日人流量、寿光最近价格行情、菜博会新品种/新技术/新模式)...,给用户视觉体验效果更好;v-if和v-show的区别请移步vue官方:https://cn.vuejs.org/v2/guide/conditional.html 第一屏切换至第二屏:监听视频的播放+.../option.html#title 当前项目安装echarts依赖,npm install echarts -save 全局引入/按需引入; 全局:main.js import echarts...src="http://127.0.0.1/en/cbhs2.html" frameborder="0" wmode="opaque" scrolling="no">

    5.6K40

    CSS 中的相对单位

    # 相对值的优势 CSS 为网页带来了后期绑定(late-binding)的样式:直到内容和样式都完成了,二者才会结合起来。这会给设计流程增加复杂性,而这在其他类型的图形设计中是不存在的。...一个字号当然不能等于自己的 1.2 倍。实际上,这个 font-size 是根据继承的字号来计算的。...1.2 */ background-color: lightgreen; padding: 1.2em; /* 1.2em => 16px X 1.2 X 1.2 */ } ...这等价于类型选择器 html,但是 html 的优先级相当于一个类名,而不是一个标签。 rem 是 root em 的缩写。rem 不是相对于当前元素,而是相对于根元素的单位。...1.2em 到底是多少像素并不重要,重点是它比继承的字号要稍微大一点。如果在屏幕上的效果不理想,就调整它的值,反复试验。这种方式同样适用于像素值。

    91420

    浅谈移动端中的视口(viewport)

    这个元素的宽度究竟是多少像素呢? 事实上,这里已经涉及了两种不同的像素:物理像素和 CSS 像素。...1.2 三种视口 移动端浏览器通常宽度是 240px~640px,而大多数为 PC 端设计的网站宽度至少为 800px,如果仍以浏览器窗口作为视口的话,网站内容在手机上看起来会非常窄。...如果要显式设置布局视口,可以使用 HTML 中的 meta 标签: "viewport" content="width=400"> ? 布局视口使视口与移动端浏览器屏幕宽度完全独立开。...当设置屏幕分辨率为 1920px1200px 的时候,理想视口的宽度值是 1920px, 那么 dip 的宽度值就是 1920px。...这等于拿一个2倍的放大镜去看图片,图片就会变得模糊。 这时,就需要使用 @2x 甚至 @3x 图来避免图片的失真

    2.3K20

    Wolfram|Alpha 中的分步解答数学工具帮助您学习化学课程

    此外,Wolfram|Alpha还可以用来重写一个不是y = mx + b形式的方程,将其变成这种形式。例如,给定方程 2x + 7y - 5 = 0,斜率和截距是多少?...继而,如果有人要问给定x=5,y的值是多少,通过计算x=5时的-2/7x+5/7,答案是-5/7,可以用前面看到的基本代数技巧来计算: 能够识别斜率和y截距是什么,还能插值确定y是什么,对于化学中的题目...我们举个例子,用乘除法求x,给定方程8*x=3*0.08206*298,x的值是多少?这其实是直接从理想气体定律中提取的方程,并插入了数值。理想气体定律问题可以让我们求解压力、体积、物质的量和温度。...给定0.0125=(x)*(x+0.1)/(3-x),那么x是多少?...例如,log10(100)=2的指数形式是什么?应该是102=100。鉴于这个例子,你应该能够确定一个变量的值,给定一个对数问题。例如,在 log10(x) = 4 中,x 的值是多少?

    1.6K30

    Web前端学习 第2章 网页重构18 rem布局

    四、设计稿量尺 我们再从web开发流程的角度来看,为什么rem布局比百分比布局更加简便,使用rem布局的流程如下所示: 首先,我们拿到设计师的设计稿,通常设计稿的宽度为640px、720px、1080px...然后再来看看我们的fontsizeset.js文件中的一段代码,第二个数字720就是设计稿的宽度,如果设计稿是1080px,我们需要将fontsizeset.js中的720改成1080。...1 docEl.style.fontSize = 100 * (clientWidth / 720) + 'px'; 最后量尺的时候,如果设计稿中的元素尺寸为x,那么元素的尺寸我们就可以设置成x/100rem...我们引入的js文件是720px的设计稿,那么假如设计稿中有一个360px的元素,则该元素广告就是原设计稿的一半,这样我们通过换算可以得到这个元素在网页中的尺寸是3.6rem,所以当我们设置成3.6rem...通过上述的方法,就可以很容易制作出按百分比排列的页面布局了,这就是rem布局的优势。 课后练习 按照设计稿,完成融职教育手机端的首页。 按照设计稿,完成融职教育手机端的视频详情页面。

    43630
    领券