首页
学习
活动
专区
工具
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设计,用户使用时候放在小屏幕上看就出现很多样式改变或者被压缩换行,界面适配比较不好做时候,也可以使用等比缩放。...等比缩放最初我是用cssrem来做,那会儿单纯写h5,用px的话,手机显示屏分辨率不一样,用px做单位很难适配,用百分比的话,开发时候真的要疯了,得按照设计图一个单位一个单位去算。...后来想到了用cssrem做单位,只要保证根节点(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.8K80

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

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

    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

    67520

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

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

    3.1K60

    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属性,那么如果htmlfont-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

    44710

    基于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.1K40

    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 到底是多少像素并不重要,重点是它比继承字号要稍微大一点。如果在屏幕上效果不理想,就调整它值,反复试验。这种方式同样适用于像素值。

    90620

    浅谈移动端中视口(viewport)

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

    2.2K20

    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布局优势。 课后练习 按照设计稿,完成融职教育手机端首页。 按照设计稿,完成融职教育手机端视频详情页面。

    42630
    领券