魁梧的路灯
2025-07-02 14:27:55
EM,在工程上是指设计管理，PC通常是指采购，施工总承包。这是一个工程领域的概念。给你看一个实例，或许可以帮助你理解它到底是什么：惠生工程（中国）有限公司，遵照国际通行的方法，采用EPC（设计-采购-施工总承包）、EM+PC（设计管理-采购-施工总承包）、EP（设计-采购总承包）、PC（采购、施工总承包）、PMC（项目管理承包）等多种项目管理模式承接大型煤化工装置的工程建设。理解了么？
魔幻的小蝴蝶
2025-07-02 14:27:55
静态布局也叫做固定布局，网页内容区采⽤绝对宽度，网页内每个模块的尺寸大小固定，一般整体在浏览器内居中显示，并会设置最小宽度min-width，当分辨率小于最小宽度就会出现滚动条，如果大于最小宽度则内容居中外加背景 。
应用场景 目前大部分的高校官网、医院官网、政府网站等都是静态布局，而且设计风格上也很老旧，当然并不是说静态布局的风格就是老旧，这个布局和设计风格没有多大关系，有很多新闻门户类、企业官网等网站采用静态布局，同样也很出彩。
优点 这种布局方式对设计师和前端来说都是最简单的，不用去考虑兼容性等问题。设计和开发成本低，后期维护成本低
缺点 在小屏上有可能出现横向滚动条，在大屏上会出现大量的空白，不能根据用户的屏幕尺寸做出不同的表现，用户体验比较差。
流式布局是指页面按照百分比%定义宽度（也就是长度单位不是我们平常使用的px，而是百分数），来适配不同的屏幕分辨率，在不同的分辨率下网页布局保持不变，一般搭配min-、max-属性来控制尺寸流动范围，以免过大或者过小影响展示和阅读，页面内元素的高度和文字大小往往px来固定住，方便页面排版和阅读。流式布局的特点是，如果宽度太小，放不下两个元素，后面的元素会自动滚动到前面元素的下方，不会在水平方向overflow（溢出），避免了水平滚动条的出现。
应用场景 流式布局典型的代表是栅格系统，一般页面中采用百分比定宽的部分都可以看做是流动布局的属性。目前大部分网页为了实现更好的视觉效果都会全局或局部使用流式布局。
优点 在不同分辨率屏幕上能够很好的展示页面元素，如果设计得当，流动布局能避免在小屏幕上出现水平滚动条，对于差别不是很大的屏幕分辨率十分友好。
缺点 当屏幕分辨率差异过大时，因为宽度使用%百分比定义，但是高度和文字大小等大都是用px来固定，有些页面元素宽度被拉的很高，页面缩小后，一些字或者图片或者图表等会产生堆叠，显示效果不太好控制。
响应式布局是指网页分别为不同的屏幕分辨率定义不同的布局，同时在每个布局中，各元素大小采用百分比定义宽度，即页面元素宽度随着窗口调整而自动适配。可以看做是定义了几个不同尺寸的流式布局。
优点 能够适应pc、pad和移动端，在任何尺寸的屏幕上都能呈现完美的视觉效果
缺点 要匹配足够多的屏幕大小，需要设计多个版本，设计和开发工作量大
弹性布局翻译过来不是em/rem layout ，因为弹性布局采用的单位是em或者rem，为了直观，所以直接采用了单位缩写去区分。em和rem是一个相对长度单位，页面内各元素的尺寸采用em/rem做单位，em是相对其父元素大小，rem是始终相对于html大小，即页面根元素。
优点 弹性适配不同的分辨率，视觉效果比较好
缺点 em以父节点font-size大小为参考点，进行任何元素设置，都需要知道他父元素的大小，容易造成页面排版混乱，rem支持的浏览器比较少。
个人理解的，felx布局主要是用来定义页面内某些元素相对于父级元素的对齐、排序、分布等排版方式，通过调整父级内元素的宽高，从而在任何显示设备上实现对可用显示空间最佳填充的能力。
优点 能够很好的契合移动端，无需考虑分辨率问题，移动端flex布局占据主流
缺点 PC端网页兼容性不好，ie浏览器必须是10.0版本以上；对设计稿要求很高，需要是有规律的设计稿，比如栅格系统；网页内容较多时，flex布局不太好控制。
慈祥的外套
2025-07-02 14:27:55
em 和 rem 都是相对单位，由浏览器转换为像素值，具体取决于您的设计中的字体大小设置。 如果你使用值 1em 或 1rem，它可以被浏览器解析成 从16px 到 160px 或其他任意值。 padding设置了1em padding设置了1em 另一方面，浏览器使用 px 值，所以 1px 将始终显示为完全 1px。 滑动滑块试试这个 CodePen 例子，你可以看到rem 和 em 单位的值可以转化为不同的像素值，而 px 单位保持固定大小。 使用 em 和 rem 单位可以让我们的设计更加灵活，能够控制元素整体放大缩小，而不是固定大小。 我们可以使用这种灵活性，使我们在开发期间，能更加快速灵活的调整，允许浏览器用户调整浏览器大小来达到最佳体验。 em 和 rem 单位提供的这种灵活性和工作方式都很相似，所以最大的问题是，我们何时应使用 em 值，何时应使用 rem 值呢? em 和 rem 单位之间的区别是浏览器根据谁来转化成 px 值，理解这种差异是决定何时使用哪个单元的关键。 我们要通过复习 rem 和 em 单位如何工作，来确保你知道每一个细节。 然后我会讲到为什么你应该使用 em 或 rem 的单位。 最后，我们会看看到底哪些典型元素的设计，你应该在实际应用中使用哪种类型的单位。 当使用 rem 单位，他们转化为像素大小取决于页根元素的字体大小，即 html 元素的字体大小。 根元素字体大小乘以你 rem 值。 例如，根元素的字体大小 16px，10rem 将等同于 160px，即 10 x 16 = 160。 CSS 设置 padding 为 10rem 当使用 em 单位时，像素值将是 em 值乘以使用 em 单位的元素的字体大小。 例如，如果一个 div 有 18px 字体大小，10em 将等同于 180px，即 10 × 18 = 180。 CSS设置padding为10em 有一个比较普遍的误解，认为 em 单位是相对于父元素的字体大小。 事实上，根据 W3标准 ，它们是相对于使用em单位的元素的字体大小。 父元素的字体大小可以影响 em 值，但这种情况的发生，纯粹是因为继承。 让我们看看为什么以及如何起作用。 使用 em 单位存在继承的时候，情况会变得比较棘手，因为每个元素将自动继承其父元素的字体大小。 继承效果只能被明确的字体单位覆盖，比如 px, vw。 使用 em 单位的元素字体大小根据它们来定。 但该元素可能继承其父元素的字体大小，而父元素又继承其父元素的字体大小，等等。 因此，以 em 为单位的元素字体大小可能会受到其任何父元素的字体大小影响。 让我们看看一个例子。 在下面的 CodePen 单步执行试试。 随着你的前进，使用 Chrome 开发工具或 Firebug 为火狐浏览器来检查我们的 em 单位计算到的像素值。 如果我们的根元素字体大小为 16px (通常是默认值) 一个子元素 div 里面 padding 值为 1.5em，该 div 将从根元素继承字体大小 16px。 因此 padding 会解析成 24px，即 1.5 x 16 = 24。CodePen示例如果我们加多一个div来包裹原先的div，然后设置其字体大小为 1.25em 呢?CodePen示例我们包裹的 div 继承根元素字体大小 16px ，并乘以它自己的 1.25em 的字体大小。 这将设置包裹 div 字体大小为20px，即 1.25 x 16 = 20。 现在我们原始的 div 不再直接从根元素继承,而是从其新的父元素继承字体大小为 20px 1.5em 其padding值现在等于 30px，即 1.5 x 20 = 30。 这个继承效应可以更复杂，如果我们向我们原始的 div 添加 em 字体单位，比方说 1.2em。CodePen示例div 从其父级继承 20px 字体大小，然后，乘以它自己的 1.2em 设置，给它 24px，即 1.2 × 20 = 24 新字体大小。 div上1.5em的 padding 现在将再次改变大小，用新的字体大小，36px，即 1.5 × 24 = 36 。 最后，为了进一步说明那个 em 单位是相对于他们最终获得(不是父元素)的字体大小，让我们来看看设置padding: 1.5em 如果我们显式设置 div 使用 14px值，不继承字体大小会发生什么。CodePen示例现在，我们的padding为 21px，即 1.5 x 14 = 21 已经变小了。 它不受父元素的字体大小。 由于存在着这些隐患，你可以看到为什么必须知道如何正确管理使用 em 单位。 默认情况下浏览器通常有字体大小 16px，但这可以被用户更改为从 9px 到 72px的任何值。 根 html 元素将继承浏览器中设置的字体大小，除非显式设置固定值去覆盖。 所以 html 元素的字体大小虽然是直接确定 rem 值，但字体大小可能首先来自浏览器设置。 因此浏览器的字体大小设置可以影响每个使用 rem 单元以及每个通过 em 单位继承的值。 除非重写，否则它将继承浏览器默认设置的字体大小。 例如，让我们把网站的html元素没有设置font-size值。 如果用户让他们的浏览器默认字体大小为 16px，那么根元素字体大小将为 16px。 在 Chrome 开发工具下，你可以在已计算选项卡下看到一个元素继承的属性。 在这种情况下 10rem 等于 160px，即 10 x 16 = 160。 如果用户将其浏览器中的默认字体大小调为18px，根字体大小变成 18px。 现在 10rem 转换为 180px，即 10 × 18 = 180。 当 em 单位设置在 html 元素上时，它将转换为em值乘以浏览器字体大小的设置。 例如，如果网站的 html 元素的字体大小属性设置为 1.25em，根元素字体大小将为 1.25 倍的浏览器的字体大小设置。 如果浏览器字体大小被设置为 16px，根字体大小会出来为 20px，即 1.25 x 16 = 20。 在这种情况下 10rem 将等于 200px，即 10 × 20 = 200。 所以，如果浏览器字体大小被设置为 20px，根元素字体大小会解析成 25px，即 1.25 × 20 = 25。 现在 10rem 将等于 250px，即 10 × 25 = 250。 上述所有归结如下: rem 单位提供最伟大的力量并不仅仅是他们提供一致尺寸而不是继承。 相反，它给我们的一个途经去获取用户的偏好来影响网站中每一处使用rem的元素大小，不再是使用固定的 px 单位。 为此，使用 rem 单位的主要目的应该是确保无论用户如何设置自己的浏览器，我们的布局都能调整到合适大小。 一个站点最初设计可以专注于最常见的默认浏览器中字体大小 16px。 使用浏览器默认字号16px 但是，通过使用 rem 单位，如果用户调整其字体大小，我们也能保证布局的完整性，使用较小的文本避免文本空间被压扁了。 浏览器解析的字号为34px。 如果用户缩小其字体大小，整个布局掉下来，空白区域中的文本也不会想得很无力。 浏览器字体大小 9px 用户会因为各种各样的原因更改字体大小设置。 容纳这些设置可以获得更好的用户体验。 重要的是: 一些设计师使用结合 rem 单位的方式给html元素设置了一个固定的px单位。 这是很普遍的做法，所以改变html元素的字体大小时，可以使整个页面做相应调整 我强烈反对种做法，因为它重写继承了用户设置的浏览器字体大小。 更夸张的说，这剥削了用户自行调整以获得最佳视觉效果的能力。 如果您确实需要更改 html 元素的字体大小，那么就使用em，rem单位，这样根元素的值还会是用户浏览器字体大小的乘积。 这将允许您通过更改您的 html 元素的字体大小，调整你的设计，但仍会保留用户的浏览器设置的效果。 em 单位取决于一个font-size值而非 html 元素的字体大小。 为此，em 单位的主要目的应该是允许保持在一个特定的设计元素范围内的可扩展性。 例如，您可能使用em 值设置导航菜单项的padding、 margin，line-height等值。 带有0.9rem 字体大小的菜单 通过这种方式，如果您更改菜单的字体大小菜单项周围的间距将在剩余的空间按比例缩放。 带有1.2rem 字体大小的菜单 前面一节中你看到em 单位如何变得不可收拾。 为此，我建议只在你标识清楚的情况下使用 em 单位。 一些 Web 设计师之间存在辩论，我相信不同的人有不同的首选的方法，但我的建议是，如下所示。 根据某个元素的字体大小做缩放而不是根元素的字体大小。 一般来说，你需要使用 em 单位的唯一原因是缩放没有默认字体大小的元素。 根据我们上面的例子，设计组件比如按钮，菜单和标题可能会有自己明确的字体大小。 当你修改字体大小的时候，你希望整个组件都适当缩放。 通用属性这一准则将适用于在非默认字体大小的元素上的padding、 margin、 width、 height和line-height等值。 我建议，当您使用 em 单位，他们使用的元素的字体大小应设置对rem单位，以保留的可扩展性，但避免继承混淆。 我们经常会看到使用em作为字体大小单位，特别是标题，当我认为如果使用rem将更具可扩展性。 标题经常使用 em 单位的原因是他们相比px单位，在相对常规文本大小方面更出色。 然而 rem 单位同样也可以实现这一目标。 如果 html 元素上任何字体大小调整，标题大小仍会缩放。 请尝试更改下面的 CodePen，看看 html 元素上的 em 字体大小如何起作用:CodePen示例少部分情况下，我们不想我们的字体大小根据根元素做调整，只有几个例外的情况。 我们可以想到的例子是一个使用 em 字体大小的下拉菜单，我们有第二个级别的菜单项文本大小取决于第一级字体大小。 另一个例子可能是用在按钮里面的字体图标，字体图标的大小跟按钮的文本大小有关。 然而，大多数 Web 设计中的元素往往不会有这种类型的要求，所以一般使用 rem 单位的字体大小，em 单位只在特殊的情况下使用。 不需要 em 单位，并且根据浏览器的字体大小设置缩放的任何尺寸。 这几乎在一个标准的设计中占据了一切，包括height，width，padding，margin，border，font-size，shadows，几乎包括你布局的每部分。 简单地说，一切可扩展都应该使用 rem 单位。 创建布局时，往往要以像素为单位更方便，但部署时应使用rem单位。 你可以使用预处理比如 Stylus / Sass / Less ， 来自动转换单位 或 PostCSS 之类的插件。 或者，您可以使用 PXtoEM 手动做您的转换。 特别注意，当使用 rem 单位创建统一可扩展的设计，媒体查询也应该是rem单位。 这将确保，无论用户浏览器的字体大小，您的媒体查询会对它作出反应和调整您的布局。 例如，如果用户缩放文本非常高，您的布局可能需要从两列到单个列调整，因为它可能会在较小的移动设备上显示。 如果您的断点在固定的像素宽度，只有不同的视口的大小可以触发它们。 但是基于 rem 的断点他们将响应不同的字体大小。 布局中的列宽通常应该是 %，因此他们可以流畅适应无法预知大小的视区。 然而单一列一般仍然应使用 rem 值来设置最大宽度。 例如: 这保持列的灵活，可扩展。又能防止变得太宽了。 在一个典型的 Web 设计的过程中，不会有很多部分的你不能使用伸缩性设计的布局。 不过偶尔你会遇到真的需要使用显式的固定的值，以防止缩放的元素。 采用固定的尺寸值的前提应该是，如果被缩放的话，它的结构会被打碎。 这真的不常出现，所以你想拿出那些 px 单位之前，问问自己是否使用它们是绝对必要的。 让我们以一个快速符号点概括我们介绍的内容:
危机的西装
2025-07-02 14:27:55
（一） 关键点
1. 以前IE无法调整那些使用px作为单位的字体大小，但现在几乎IE都支持；
2. 国外的大部分网站能够调整的原因在于其使用了em作为字体单位
3. Firefox能够调整px和em，但是96%以上的中国网民使用IE浏览器(或内核)。
（二） em如何来的？
1. 任意浏览器的默认字体高都是16px。所有未经调整的浏览器都符
合: 1em=16px。 那么12px=0.75em,10px=0.625em。
2. 为了简化font-size的换算，需要在css中的body选择器中声明 Font- size=62.5%，这就使em值变为 16px*62.5%=10px, 这样12px=1.2em, 10px=1em, 也就是说只需要将你的原来的px数值除以10，然后换上em作为单位就行了。
（三） em有如下特点：
1. em的值并不是固定的
2. em会继承父级元素的字体大小。
（四）__所以我们在写CSS的时候，需要注意两点： __
1. body选择器中声明Font-size=62.5%；
2.将你的原来的px数值除以10，然后换上em作为单位
3. 重新计算那些被放大的字体的em数值。避免字体大小的重复声明。
例如：
再如: 以下表示首行缩进两个字符
当客户端的浏览器文本大小设置为“medium”, ems和百分比之间没有区别。然而,当设置改变,差别是相当大的。“Smallest”设置,ems比百分比小得多,而当设置为“Largest”,这时恰恰相反,ems比百分比显示地更大。有些可能会说,当真正去扩展时em单位在扩展,在实际的应用程序中,em文本尺度变化太大, 在一些客户端机器上最小的文本变得不是很清晰。
一般来说, 1 em = 12 pt = 16 px = 100% 。确定body的字体大小时候，当使用这些font-size, 增加基础本字体大小(使用CSS选择器)从100%到120%，让我们看看会发生什么。
一般来说,当我开始一个新的设计,我将在 body元素上使用百分比 (body { font-size: 62.5%})， 然后使用em单位大小 来比较。只要body使用百分比单位设置,您可以选择使用百分比或ems或其他任何CSS规则和选择器并且在你的基础字体大小上保持使用百分比的好处。在过去的几年中,这确实成为设计的标准。
像素现在被认为是可接受的字体大小单位(用户可以使用浏览器的“缩放”功能读小文本),虽然由于移动设备非常高的密度屏幕(一些Android和iPhone设备每英寸超过200到 300个像素,让你11 - 12-pixel字体很难看到!)他们也开始引起一些问题。因此,我将继续使用百分比作为web文档中的基础字体大小。
狂野的柠檬
2025-07-02 14:27:55
em是Effective Microorganisms的简写，意思是“有效微生物群”。它是光合细菌、乳酸菌群、酵母菌群、放线菌群、丝状菌群等5科10属80余种微生物组成的。它是由世界著名应用微生物学家日本琉球大学比嘉照夫教授发明的，EM技术是目前世界上应用范围最大的一项生物工程技术。
和一般生物制剂相比，它具有结构复杂、性能稳定、功能齐全的优势，表现出前所未有的高科技水平。迄今为止，EM已狂风般席卷日本、美国、巴西、法国、台湾等90多个国家和地区。据资料报道，EM适用于种植业、养殖业、环保、人体保健等多种领域。
EM中主要含有以乳酸菌、酵母菌、光合菌等为主的有益微生物。将EM投放在环境中，能在局部形成优势菌群，引导环境微生物群向良性方向活动，并抑制腐败菌、病源菌的增殖，从而起到改善环境、改良土壤、净化水质、消除臭味、抑制腐败的作用。
EM的基本产品通称EM原液，由株式会社EM研究机构主导EM产品开发及全球推广活动。
扩展资料：
EM还用于表示HTML术语。<em>(emphasize) 标签告诉浏览器把其中的文本表示为强调的内容。对于所有浏览器来说，这意味着要把这段文字用斜体来显示。在文本中加入强调也需要有技巧。如果强调太少，有些重要的短语就会被漏掉。
如果强调太多，就无法真正突出重要的部分。这与调味品一样，最好还是不要滥用强调。尽管<em>标签修饰的内容都是用斜体字来显示，但这些内容也具有更广泛的含义，将来的某一天，浏览器也可能会使用其他的特殊效果来显示强调的文本。
如果你只想使用斜体字来显示文本的话，请使用 <i>标签。除此之外，文档中还可以包括用来改变文本显示的级联样式定义。除强调之外，当引入新的术语或在引用特定类型的术语或概念时作为固定样式的时候，也可以考虑使用 <em>标签。
<em>标签可以用来把这些名称和其他斜体字区别开来。
参考资料：百度百科-EM （日本教授发明的一种微生物技术）
