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

<p>在没有任何css的手机上标记不同的字体大小

在没有任何CSS的手机上标记不同的字体大小,可以使用HTML的<font>标签来实现。<font>标签可以用来设置文本的字体、大小、颜色等属性。

以下是一个示例代码:

代码语言:txt
复制
<p>
  这是默认字体大小的文本。
</p>
<p>
  <font size="4">这是字体大小为4的文本。</font>
</p>
<p>
  <font size="6">这是字体大小为6的文本。</font>
</p>

在上面的代码中,使用了<font>标签来设置不同的字体大小。size属性用于指定字体的大小,数值越大字体越大。在示例中,第二个<font>标签设置了字体大小为4,第三个<font>标签设置了字体大小为6。

然而,需要注意的是,<font>标签已经被HTML5废弃,不再推荐使用。现代的前端开发中,推荐使用CSS来控制字体大小。可以通过CSS的font-size属性来设置字体大小,然后通过媒体查询等技术来适配不同的设备。

如果要在没有CSS的环境下标记不同的字体大小,可以使用<span>标签,并通过行内样式来设置字体大小。以下是一个示例代码:

代码语言:txt
复制
<p>
  这是默认字体大小的文本。
</p>
<p>
  <span style="font-size: 16px;">这是字体大小为16px的文本。</span>
</p>
<p>
  <span style="font-size: 24px;">这是字体大小为24px的文本。</span>
</p>

在上面的代码中,使用了<span>标签来包裹需要设置字体大小的文本,并通过style属性来设置行内样式。font-size属性用于指定字体的大小,数值越大字体越大。在示例中,第二个<span>标签设置了字体大小为16px,第三个<span>标签设置了字体大小为24px。

需要注意的是,以上示例中的字体大小单位为像素(px),在实际开发中可以根据需要选择合适的单位,如em、rem等。

腾讯云相关产品和产品介绍链接地址:

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

相关·内容

为什么你永远不应该在CSS中使用px来设置字体大小

案例证明:CSS中, px , em 或 rem 单位之间没有功能上区别的想法是一个我一遍又一遍听到误解,因此我想在这里发帖来解决这个问题。 我们要非常清楚:CSS中使用单位绝对很重要。...高分辨率屏幕浏览网页,如果CSS 1px 仍然对应于一个字面设备像素,那么甚至阅读任何内容都将非常困难,因为像素本身正在迅速缩小。毕竟,现代智能手机分辨率甚至比高清电视还要高。...我们 CSS 中, 1px 东西可能会占用多个物理硬件像素,而我们没有任何CSS 方法来指定一个字面设备像素。但这没关系,因为它们通常太小了,我们不想去处理它们。...大多数情况下,这些并不在本讨论语境中真正重要,但我认为了解这些还是很好。重要部分是: 1px 等于浏览器视为单个像素任何内容(即使硬件屏幕它不是真正像素)。...继续讲述不严格相关但仍然有趣小知识: "em" 是一个排版术语,实际比计算机早了几十年。排版,一个 em 等于当前字体大小

1.6K20

移动web开发之rem适配布局

使用@media查询,可以针对不同媒体类型定义不同样式 @media可以针对不同屏幕尺寸设置不同样式 当你重置浏览器大小过程中,页面也会根据浏览器宽度和高度重新渲染页面 目前针对很多苹果手机...、android手机、平板等设备都用得到多媒体查询 2.2语法规范 /* 这句话意思是:我们屏幕 并且 最大宽度是 800像素 设置我们想要样式 */...弊端 css是一门非程序式语言,没有变量、函数SCOPE(作用域)等概念 css需要书写大量看似没有逻辑代码,css冗余度是比较高 不方便维护及扩展,不利于复用 css没有很好计算能力...作为CSS一种形式扩展,它并没有减少CSS功能,而是现有的css语法,为CSS加入程序式语言特性。...那么320px设备时候,字体大小为320/15就是21.33px 用我们页面元素大小 除以不同html 字体大小会发现他们比例还是相同 比如我们以750为标准设计稿 一个

1.9K20

rem适配布局

rem 作用于非根元素字体大小时,相对于根元素字体大小;rem 作用于根元素字体大小时,相对于其初始字体大小。...使用@media 查询,可以针对不同媒体类型定义不同样式; @media 可以针对不同屏幕尺寸设置不同样式; 重置浏览器大小过程中,页面也会根据浏览器宽度和高度重新渲染页面; 苹果手机、Android...需要大量看似没有逻辑代码,CSS 冗余度较高 不方便维护及扩展,不利于复用 没有良好计算能力 介绍 Less(Leaner Style Sheets 缩写)是一门 CSS 扩展语言,成为 CSS...常见 CSS 预处理器: Sass、Less、Stylus Less 作为 CSS 一种形式扩展,没有减少 CSS 功能,而是现有的 CSS 语法,加入程序式语言特性。...实现 使用媒体查询根据不同设备按比例设置 html 字体大小 页面元素使用 rem 做单位。这样的话,当 html 字体大小变化(即不同设备)时,元素尺寸也会发生变化,从而达到等比例缩放适配。

1.3K30

移动开发-媒体查询布局

: CSS是非程序式语言,没有变量、函数、SCOPE(作用域)等概念 CSS需要书写大量看似没有逻辑代码,CSS 冗余度是比较高 不方便维护及扩展,不利于复用 CSS没有很好计算能力 非前端开发工程师来讲...一种形式扩展,它并没有减少CSS功能,而是现有的CSS语法,为CSS加入程序式语言特性 它在CSS语法基础之上,引入了变量,Mixin(混入),运算以及函数等功能,大大简化了CSS编写,并且降低了...用页面元素大小 除以不同html字体大小会发现它们比例还是相同 50*50像素页面元素,320屏幕下,就是 50 / 21.33 转换为rem 就是2.34rem 320屏幕下,html字体大小为...字体大小 3️⃣ Flexble.js + rem 方案 : 不需要再写不同屏幕媒体查询,因为里面js做了处理 它原理是把当前设备划分为10等份,不同设备下,比例还是一致 我们要做,就是确定好当前设备...来去算 Github地址:https://github.com/amfe/lib-flexible 4️⃣ VSCode px转换rem插件: CSSrem 用不同字体大小时记得设置里 设置字体大小

1.2K30

rem适配布局

1、rem基础 rem单位 rem (root em)是一个相对单位 ,类似于em , em是父元素字体大小不同是rem基准是相对于html元素字体大小。...CSS 需要书写大量看似没有逻辑代码, CSS冗余度是比较高。 不方便维护及扩展,不利于复用。...CSS没有很好计算能力 非前端开发工程师来讲 ,往往会因为缺少CSS编写经验而很难写出组织良好且易于维护CSS代码项目。...做为CSS一种形式扩展,它并没有减少CSS功能,而是现有的CSS语法,为CSS加入程序式语言特性。...④那么320px设备时候 ,字体大小为320/15就是21.33px ⑤用我们页面元素大小除以不同html字体大小会发现他们比例还是相同 ⑥比如我们以750为标准设计稿 ⑦一个100*100

1.9K30

前端成神之路-移动web开发_rem布局

使用 @media查询,可以针对不同媒体类型定义不同样式 @media 可以针对不同屏幕尺寸设置不同样式 当你重置浏览器大小过程中,页面也会根据浏览器宽度和高度重新渲染页面 目前针对很多苹果手机...less 基础 维护css弊端 CSS 是一门非程序式语言,没有变量、函数、SCOPE(作用域)等概念。 CSS 需要书写大量看似没有逻辑代码,CSS 冗余度是比较高。...做为 CSS一种形式扩展,它并没有减少CSS功能,而是现有的CSS语法,为CSS加入程序式语言特性。...,字体大小为320/15就是 21.33px ⑤用我们页面元素大小除以不同 html字体大小会发现他们比例还是相同 ⑥比如我们以750为标准设计稿 ⑦一个100100像素页面元素 750屏幕下...,我们默认html字体大小为 50px,注意这句话写到最上面 rem 适配方案2 手机淘宝团队出简洁高效 移动端适配库 我们再也不需要在写不同屏幕媒体查询,因为里面js做了处理 它原理是把当前设备划分为

1.1K20

CSS单位em和rem

写过样式都知道CSS是有单位,想要写出还原设计稿完美样式,离不开好单位。...应该很多都知道rem是根据HTML元素设置字体大小来定义单位,em是根据父元素设置字体大小来设置,但是很多没有真的搞清楚这两个单位对应px单位到底是怎么对应。...根据这个特性,我们就可以动态设置HTML字体大小,来自适应不同手机分辨率,当然,最好我们设置成能整十整百计算,好比1rem=100px,而不是1rem=75px,这样方便写样式时候计算。...当我们没有设置字体大小时候 这是em单位 默认是浏览器默认字体大小,Chrome是16px。...Em单位是优先根据自身字体大小,如果没有就向上寻找最近父元素有设置字体大小来换算。其实只要写一写上面的代码然后看一看浏览器显示大小就很容易知道em和rem是根据上面来换算。 (完)

1.1K20

css应知应会 第一集

p 标记文本颜色 为 蓝色 3、想将所有的 p 标记颜色,更改为 粉色 HTML 中,想实现标记样式,只能靠属性完成 使用属性设置页面元素样式问题...: 1、相同样式不同标记中用不同属性 ...2、由于属性独立性,导致相同操作,不同元素中要多次实现 疑是地上霜... 中 3、外部样式表 将样式内容定义在外部 CSS 文件中(***.css) HTML页面中引入 ***.css 去使用样式内容 详解...允许为一个元素定义多个样式规则,如果样式规则中样式属性不冲突时候,他们则都可以被应用到元素 3、优先级 层叠性基础,如果样式属性声明冲突时,会按照不同使用方式优先级来应用样式

1K20

5个改变你编写CSS方式新功能

基本,如果 form 没有无效 input ,它只包含有效 inputs ,所以它是有效 form 。...如果你想知道用户是否聚焦子元素怎么办?如果页面上有一个iframe或者菜单中子链接,这将非常有用。...尽管第二个p选择器更具体(因为它在更深位置),但由于它位于“type”层内部,20像素字体大小不会覆盖18像素字体大小 也可以这么认为, @layer 内所有内容都写在样式表顶部,就像这样:...我们可以完全抛弃 transforms ,并且没有它们情况下为我们元素添加样式。...这在非方形屏幕非常方便,比如智能手表或一些手机屏幕弯曲到边缘。你可以直接使用这些 safe-area-inset-* ,但它们值是0像素。

20520

2021前端面试高频 HTML + CSS

❝ 单冒号 : 用于 CSS3 伪类选择器中 双冒号 : 用于 CSS3 伪元素选择器中 伪类选择器 是用来向元素添加特殊效果,用伪类定义样式并不是作用在标记上,而是作用在标记状态,如a标签:...p::selection 被用户选取部分 ::before p::before 选择器前增加内容 ::after p::after 选择器后增加内容 ❞ 3....CSS 样式权重 ❝css优先级规则: css选择规则权重值不同时,权重值高优先; css选择规则权重值相同时,后定义规则优先; css属性后面加 !...❝ 不同浏览器默认 margin 和 padding 不同。...rem rem是CSS3新增一个相对单位,使用rem为元素设定字体大小时,仍然是相对大小,但相对只是HTML根元素。

90340

8个用于编写可维护,简化前端代码CSS策略

1.不要写出不需要样式定义 例如:编写display:block时候,很多元素默认都有这种风格。 另一个例子是元素定义字体大小,它将继承你正在定义正文字体大小。...编写可重用css类可以解决一些事情: 它可以确保您设计不同页面之间保持一致。当你很多页面上共享你CSS类时,你知道当你改变这个类时,它会在每一个出现在页面上页面上改变。...另外,因为我将自己hover定义自己锚点,所以红色链接将会变成黑色悬停,而不必定义任何其他样式。...important移动设备类来重写.hide类以显示它。 我从来没有找到一个有效借口来使用!important,而不是别人错误地方用!important来定义。...7.有时间和条件重新开始,但仔细考虑你选择 重新发明轮子例子可能是客户端项目中创建自己网格CSS框架。 根据我经验,除非你想知道它是如何工作,否则自己写这些东西并没有多大好处。

1.4K90

【小程序_02】布局方式

2.5 align-content(设置侧轴子元素排列方式【多行】 ) 设置子项侧轴排列方式 并且只能用于子项出现 换行 情况(多行),单行下是没有效果 属性 说明 flex-start...默认值为 auto,表示继承父元素 align-items 属性,如果没有父元素,则等同于 stretch span:nth-child(2) { /* 设置自己侧轴排列方式 *...不同是rem是相对于html元素字体大小 /* 父元素 为 12px */ div { font-size: 12px; } /* 此时 p 字体大小是 60px*/ p { font-size...使用 @media查询,可以针对不同媒体类型定义不同样式 @media 可以针对不同屏幕尺寸设置不同样式 当你重置浏览器大小过程中,页面也会根据浏览器宽度和高度重新渲染页面 目前针对很多苹果手机...做为 CSS一种形式扩展,它并没有减少CSS功能,而是现有的CSS语法,为CSS加入程序式语言特性。

1.3K20

CSS尺寸单位介绍

css像素只是一个抽象单位,不同设备或不同环境中,css1px所代表设备物理像素是不同。...早先移动设备中,屏幕像素密度都比较低,如iphone3,它分辨率为320x480,iphone3,一个css像素确实是等于一个屏幕物理像素。...其他品牌移动设备也是这个道理。 物理像素 它是显示器(电脑、手机屏幕)最小物理显示单位,物理像素指的是显示器最小点。物理像素大小取决于屏幕。是一个无法改变属性。...,因为它使用了Retina屏幕,他dpr是2,所以iPhone 6 物理像素为 750 1334 不同屏幕(普通屏幕 vs retina屏幕),css中1px所呈现大小(物理尺寸)是一致...,能显示csspx数也不同, 如果我们写一个div,宽度是375px,375px在这个屏幕(iPhone6)是刚刚满屏,因为这个屏幕宽度刚刚是375px( 设备独立像素), 当我们换另一个宽度是414px

1.5K30

CSS尺寸单位介绍

css像素只是一个抽象单位,不同设备或不同环境中,css1px所代表设备物理像素是不同。 在为桌面浏览器设计网页中,我们无需对这个津津计较,但在移动设备,必须弄明白这点。...早先移动设备中,屏幕像素密度都比较低,如iphone3,它分辨率为320x480,iphone3,一个css像素确实是等于一个屏幕物理像素。...其他品牌移动设备也是这个道理。 物理像素 它是显示器(电脑、手机屏幕)最小物理显示单位,物理像素指的是显示器最小点。物理像素大小取决于屏幕。是一个无法改变属性。...,因为它使用了Retina屏幕,他dpr是2,所以iPhone 6 物理像素为 750 * 1334 不同屏幕(普通屏幕 vs retina屏幕),css中1px所呈现大小(物理尺寸)是一致...,能显示csspx数也不同, 如果我们写一个div,宽度是375px,375px在这个屏幕(iPhone6)是刚刚满屏,因为这个屏幕宽度刚刚是375px( 设备独立像素), 当我们换另一个宽度是414px

1.6K20

寒假提升 | Day1 软件开发-HTML结构-元素剖析

见资料分享中 2.2 认识网页和网站 网页显示过程 – 用户角度 用户浏览器输入一个网站; 浏览器会找到对应服务器地址,请求静态资源(可以存放在世界上任何一个地方); 服务器返回静态资源给浏览器...服务器本质也是一台类似于你电脑一样主机; 但是这个主机有几个特点: 二十四小时不关机(稳定运行); 没有显示器; 一般装是Linux操作系统(比如centos); 那么我以后到公司是不是就看得见服务器了呢...、渲染规则,所以同一网页不同内核浏览器中渲染效果也可能不同。...对网页进行补充 增加标记 -> 元素 -> 浏览器 -> 渲染对应效果 增加网页结构 html head title body h1 p div span 案例 – 显示一条新闻 2.3....HTML语言 超文本标记语言 为什么表标记语言?

58220

CSS:绝对单位、相对单位

作者:Abudula__ 我们对单位很熟悉,比如说,千克,千米,米等,这些就是绝对单位,我们又有听到太阳质量等于33个地球,这个就是相对单位。CSS中,单位也可以分为这两类。...任何现代显示屏,不管是手机,平板,笔记本还是电视都是由成千上万像素组成,所以我们可以使用这些像素来定义长度。 另外 CSS 将光栅图像(如照片等)显示方式定义为默认每一个图像大小为“1px”。...如此就可以将图像完整与网页其它元素排列起来。 但也有人认为px是一个相对单位,因为不同设备像素大小是不一样,比如手机屏幕像素就比电脑小很多。...如果父元素没有设置字体大小,则继续往父级元素查找,直到有设置大小,如果都没有设置大小,则使用浏览器默认字体大小。...同理如果该元素没有设置,则一直向父级元素查找,直到找到,如果都没有设置大小,则使用浏览器默认字体大小

2K20

CSS常见样式(一)

但是这种方法存在一个问题,当用户浏览器中浏览我们制作 Web页面时,他改变了浏览器字体大小(虽然一般人不会去改变浏览器字体大小),这时会使用我们Web页面布局被打破,这时就提出了使用“em”来定...所以我们CSS时候,需要注意两点: body选择器中声明Font-size=62.5%; 将你原来px数值除以10,然后换上em作为单位; 重新计算那些被放大字体em数值。...比如说你#content中声明了字体大小为1.2em,那么声明p字体大小时就只能是1em,而不是1.2em, 因为此em非彼em,它因继承#content字体高而变为了1em=12px。...3、rem是CSS3新增一个相对单位,是指根元素(root element,html)字体大小。...补充: px 与 rem 选择: 对于只需要适配少部分手机设备,且分辨率对页面影响不大,使用px即可 。

1.7K30

面试官:你了解过移动端适配吗?

一般情况下设计稿设计师按照375尺寸设计,然而,现在移动终端(就是手机)快速更新时代,每个品牌手机都有着不同物理分辨率,这样就会导致,每台设备逻辑分辨率也不尽相同,此时357设计稿,如果想要还原那基本是不可能了...上图可以清楚看到,不同分辨率所带来差距 从最初颗粒感相当大屏幕,到720p再到1080p,甚至于现在各家旗舰手机2k屏幕,我们物理分辨率变得原来越大。...1px边框问题 当我们css里写1px时候,由于它是逻辑像素,导致我们逻辑像素根据这个设备像素比(dpr)去映射到设备就为2px,或者3px,由于每个设备屏幕尺寸不一样,就导致每个物理像素渲染出来大小也不同...这些浏览器会忽略用rem设定字体大小 举个例子: //假设我给根元素大小设置为14px html{ font-size:14px } //那么我底下p标签如果想要也是14像素 p{...屏幕如果你按照设计稿还原的话,字体大小实际不一样,而人们一样距离希望看到大小其实是一样,本质,用户使用更大屏幕,是想看到更多内容,而不是更大字。

1.3K10
领券