问题标签 [em]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
2 回答
13672 浏览

css - CSS样式-百分比vs em vs px?

在网上阅读了几篇文章后,我对何时使用percent,empxfor div´s, input´s,font´s等感到有点困惑buttons......

对于我正在开发的网站,我们不想添加响应式设计,根据我从不同文章中了解到的情况,百分比是采用elementsdiv´s. 但是我感到困惑,因为我认为即使我使用 för 布局,我也应该能够获得响应式设计,而不是根据设备/屏幕分辨率px设置不同的宽度、高度......?px

是否有什么时候使用什么的最佳实践?不仅适用于字体大小,还适用于div´s其他元素?

0 投票
2 回答
919 浏览

html - 使用 em 调整字体大小 - 如果 base-size = 0 会怎样?

可能重复:
内联块列表项中不需要的边距内联块列表项
之间的空格

为了避免li设置为之间的差距display: inline-block,我将 的字体大小设置ul为 0。因此,em 大小调整的性质,0 现在作为 all 的基本字体大小传递li,这实际上意味着一个人看不到他们。

有没有办法在不设置font-size: 14px(例如)列表项的情况下解决这个问题?

0 投票
3 回答
1270 浏览

html - IE7 IE8 在布局中误解 EM?

该网站是 www.holmecourt.com,它在 Safari 和 IE9 中完全按照我的意图呈现,此屏幕截图直接在 Safari 中查看,在 Adob​​e Browserlab for IE9 中看起来完全一样:http: //holmecourt.com/图像/scrn1.png

但是,问题是 Browserlab 显示 IE8 如下,与 IE7 非常相似:http ://holmecourt.com/images/scrn2.png

IE7/8 以前在我到处使用像素时显示良好,但由于将所有内容都更改为 em,IE7/8 似乎不喜欢它。

我已经用 em 搜索了 IE 错误,但找不到任何错误,我想知道 IE7/8 如何在布局中呈现 em 是否存在已知错误?

否则,有经验的开发人员在比较屏幕截图时可能会注意到什么,我认为这可能与布局破坏、文本大小不正确有关,所以可能是字体大小被继承的问题?

我尽量不要含糊不清,但如果这篇文章是,我绝对可以尝试改写它。

所有 CSS 均可从源代码访问,但可以提供所需的任何代码。

任何帮助赞赏或寻找问题的想法赞赏!

0 投票
3 回答
560 浏览

html - 使用 javascript 将自动生成的 HTML 中的字体大小从 px 更改为 em

我有一个HTML从我无法控制的 Web 服务生成的。的HTML字体大小为pxpt。我的要求是将所有字体大小更改为em.

这是我尝试过的:

我尝试<font>使用以下方式访问所有标签:

但是,null即使我在HTML.

我阅读的所有相关资料都假设我们可以控制CSSHTML因此不适用于我的问题。

简而言之,我想解析HTML并找到所有内联样式(字体大小)并从任何其他类型更改为em.

0 投票
2 回答
2534 浏览

css - 使用 display: inline-block 和 ems 让表单元素与提交按钮对齐

我正在研究响应式表单设计;缩减的代码如下。为什么 SEND 按钮不能与其他输入字段正确对齐?

它使用的 amargin-left:5em应该与其他输入字段对齐,因为表单标签的 a 也width为 5em,但没有。相反,按钮向左偏移。我错过了什么?谢谢。

0 投票
0 回答
591 浏览

css - Mac 上的 Chrome 渲染字体大小不一致

我在运行相同操作系统 (10.7.5) 和相同版本 Chrome (24.0.1312.57) 的两台不同 Mac 上遇到问题。我遇到了一些非常奇怪的事情,似乎正文字体大小增加了 5%。我还注意到一些副本看起来稍大一些,并且图像/背景图像没有填满它们的正确容器。该站点使用和 em 编码body { font-size: 100%; }其他所有内容。我在电脑上做了一个测试,结果出现了问题,将正文字体大小更改为 95% 使一切看起来一致。

编辑:下面的图片示例。我能够使用这个小提琴创建一个测试场景

您将在第二张图片中看到,em 中的框超出了 400 像素的下划线。当字体大小为 100% 时,假设 25em = (400px / 16)。在第三张图片上,我将字体大小减小到 95%,现在 400px 等于 25em。

在此处输入图像描述 在此处输入图像描述 在此处输入图像描述

有任何想法吗?

0 投票
1 回答
191 浏览

responsive-design - 将 em 用于类型以外的事物的响应式样式

有时我希望我可以只更改媒体查询中的一个变量,然后

HTML:

少(不起作用):

这当然行不通,因为在编译时,@base已设置并应用于所有类。但是,我遇到了这种肮脏的解决方法:

较少的:

假设我的元素中实际上没有任何文本(或者文本仅出现在叶节点中并明确设置它们的字体大小),使用这种方法是否有任何严重的缺点?

0 投票
0 回答
3214 浏览

css - Em/Rem 与 Px 困境

我一直在我工作了很长时间的所有网站的所有维度上使用像素(+ 几个百分比在这里和那里)。

时不时地,我不断地看到关于 em 和 rem 的东西,并且一直在犹豫是否在像素上使用它们。

根据我的阅读,使用它们的最佳方法是将<html>元素的字体大小设置为 62.5%,以使 1em 等于 10 像素,然后指定与此相关的字体大小。

一些想法,我希望这里的人可以为我回答:

  • 如果您使用 em/rem 并且您正在构建您的网站并且您认为,此文本需要为 20px 并且您将其转换为 2em 那么为什么不首先使用像素呢?

  • 如果您将 em 用于尺寸并且想要添加图像背景尺寸并且它具有一组像素尺寸,那么您将其设置为 em 并且用户缩放,这不会破坏布局吗?

我已经读过,使用 em 可以让你在一个地方改变整个应用程序的相对字体大小(这是一个好主意,可能非常有用)但是如果你改变 html 标签上的 62.5%,1em 肯定不会更长等于 10px,因此您之前设置的简易性完全不在窗口中。

假设您有一个<div>并且您将它的背景图像设置为您之前在特定尺寸处创建的图像,并且它需要左侧的特定填充,您可以使用所有适当的尺寸和填充设置它的样式并在 em 和然后有人缩放肯定会破坏,因为您的盒子尺寸和精心制作的左侧填充物都完全脱离了窗户。

我也看过这个 sass mixin:

当然,如果有人在使用像素版本的浏览器中进行放大,并且您将其与使用 rem 版本的人进行比较,结果将会有所不同。???

我希望你们能澄清一些事情。在发布到这里之前,我已经阅读了很多关于这一切的内容,所以我想你会发布很多链接,说明去阅读这个。如上所述,我已经阅读了它们,并且在这篇文章之后仍然有上述问题。

0 投票
4 回答
1139 浏览

css - 我应该使用像素,em还是都不使用?

我试图在 css 中得到明确的答案。我想弄清楚我是否应该使用

或者

或者

一些网站说不要指定empx. 所以在那张纸条上,我应该说类似的话:

或者

你怎么看?

0 投票
3 回答
2780 浏览

css - em单位和百分比有什么区别?

我已经阅读了很多关于这个主题的文章(并搜索了 Q&A),我找到了,但我仍然不明白 em 单位和百分比之间的区别是什么。帮助?

PS我看过这个代码示例:

那应该是什么意思?为什么会有人想将行高设置为字体大小的百分比值?