使元素在 css 缩放后表现相同

2023-12-30

我一直在用 javascript 操作 div。

有时我需要让这些 div 适合大小不断变化的容器。

实现这一目标的一种方法是使用 css 缩放。 缩放的问题在于它只是缩小了元素的图片。 系统继续以相同的方式查看元素。因此所有位置等都会变得倾斜。例如,如果我将 div 定位为 top:0%,那么如果元素已缩小,它不会达到百分之零,而是略低于百分之零,因为系统认为 div 比其视觉效果显示的要大。

这种行为的变化会导致很多复杂性,因为系统现在对根本不成立的元素做出假设。 这是糟糕的编程。

我查看了“缩放”,但文章警告不要使用它。

有什么方法可以扩展元素并保持系统更新实际情况吗?


默认变换原点是50% 50%(元素的中间),因此当您使用以下命令减小元素的大小时scale,边缘从四面八方向中间“缩回”。

因此左上角似乎向下向右移动。但是如果你将变换原点设置为0% 0%(左上)只有右侧和底部移动。

希望这可以帮助!

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

使元素在 css 缩放后表现相同 的相关文章

  • 从未用 @flow 标记的导入文件中获取类型定义

    TL DR我怎么告诉flow从未声明的导入模块导入类型定义 flow 加长版 流接缝能够从不使用流语法的文件中派生类型 请参阅示例 示例文件 flow js if Math random lt 0 5 var y hello else va
  • JavaScript 重定向到新窗口

    我有以下代码 它根据下拉列表的值重定向到页面 我如何使其在新窗口中打开 function goto form var index form select selectedIndex if form select options index
  • 音频 blob 的 URL.createObjectURL 在 Firefox 中给出 TypeError

    我正在尝试从创建的音频 blob 创建对象 URLgetUserMedia 该代码在 Chrome 中可以运行 但在 Firefox 中存在问题 错误 当我打电话时stopAudioRecorder 它停在audio player src
  • 使用 KnockoutJs 映射插件进行递归模板化

    我正在尝试使用以下方法在树上进行递归模板化ko映射 插入 http knockoutjs com documentation plugins mapping html 但我无法渲染它 除非我定义separate每个级别的模板 在以下情况下
  • jquery从变量中删除html元素

    我将 html 保存在变量中 var itinerary events today html 我有很多 html 和一个按钮我想删除 它的 ID 为 myButton 如何从变量中保存的 html 中删除它 我建议这种方法 var itin
  • 跟踪用户何时点击浏览器上的后退按钮

    是否可以检测用户何时单击浏览器的后退按钮 我有一个 Ajax 应用程序 如果我可以检测到用户何时单击后退按钮 我可以显示适当的数据 任何使用 PHP JavaScript 的解决方案都是优选的 任何语言的解决方案都可以 只需要我可以翻译成
  • HTML 中部分着色的阿拉伯语单词

    我不会说阿拉伯语 但我需要我们网站上对阿拉伯语的具体支持 我需要将部分阿拉伯语单词放在 span 与单词其他部分的风格不同 当我输入两个字符时 and 它们被组合成word 但是当我使用 HTML 标记时 span span 这些字母在输出
  • 如何在使用页面锚点导航时设置“激活”类以在 Angular 2 中引导导航栏?

    我正在使用 Angular 2 和 Bootstrap 4 创建一个单页网站 我创建了一个始终位于页面顶部的导航栏组件 并且我正在使用页面锚点导航 id 请注意 我还没有创建路由模块 到目前为止还没有必要这样做 导航栏代码如下
  • 如何在react-native中获取Text组件的onPress值

    我是一名新的 React Native 开发人员 我想使用 onPress 获取 Text 组件的值并将其传递给函数
  • 动态img(或视频)标签根本不加载资源,HTTP请求处于“待处理”状态

    我尝试使用以下方法在 Web 应用程序上加载资源时遇到一些问题img or videoHTML 标签 我在我的应用程序中使用 Angular 并动态设置src的参数img标签 使用ng src src 指示 没有那么多图像和资源需要加载 在
  • 如何在没有@import的情况下减少@import?

    我用的较少 从 Google PageSpeed 我了解到 使用 importCSS 文件中的内容会影响网站速度 所以我想排除任何 import来自我的 CSS 的东西 我有 2 个不同的样式表reset css and rebuild c
  • 在 vue.js 中访问数组对象属性

    给定以下数组vue js packageMaps Object packageMap 0 Object Id 16 PackageType flag list ProductCode F BannerBase packageMap 1 Ob
  • Javascript 纪元时间(以天为单位)

    我需要以天为单位的纪元时间 迄今为止 我已经看到过有关如何翻译它的帖子 但几天后就没有了 我对纪元时间很不好 我怎么能得到这个 我需要以天为单位的纪元时间 我将解释为您想要自纪元以来的天数 纪元本身是第 0 天 或第 1 天的开始 无论您如
  • 如何更改此 jquery 插件的时区/时间戳?

    我正在使用这个名为 timeago 的插件 在这里找到 timeago yarp com 它工作得很好 只是它在似乎不同的时区运行 我住在美国东部 费城时区 当我将准确的 EST 时间放入 timeago 插件时 比如 2011 05 28
  • 为什么元素上的负底部边距会降低该元素父元素的高度?

    这可能是由于边距折叠造成的 我知道边距折叠 至少知道它如何影响相邻元素 但我不明白当涉及负边距时它如何在嵌套元素上工作 例如 在此标记和随附的 CSS 中 Markup div class parent div class child Ch
  • 将 MQTTNet 服务器与 MQTT.js 客户端结合使用

    我已经启动了一个 MQTT 服务器 就像this https github com chkr1011 MQTTnet tree master例子 该代码托管在 ASP Net Core 2 0 应用程序中 但我尝试过控制台应用程序 但没有成
  • 带有相对路径的 LESS CSS 背景

    我在使用 LESS 作为我的网站的样式表时遇到了问题 就我个人而言 我宁愿在CSS中使用相对路径而不是绝对路径 这只是我的习惯 但是现在当我使用带有导入功能的LESS时 我遇到了如下所示的问题 我有一个main less根文件夹中的文件 i
  • 在 React.js 中编辑丰富的数据结构

    我正在尝试为数据结构创建一个简单的基于网格的编辑器 但我在使用 React js 时遇到了一些概念问题 他们的文档对此没有太大帮助 所以我希望这里有人可以提供帮助 首先 将状态从外部组件传输到内部组件的正确方法是什么 是否有可能将内部组件中
  • 如何在 AngularJS 循环内使用标签

    所以我在里面ng repeat像这样 li li
  • CSS 是否有不等于选择器?

    CSS中有类似 不等于 的东西吗 例如 我有以下代码 input 但对于某些输入 我需要将其作废 我想通过将类 reset 添加到输入标签来做到这一点 例如

随机推荐

  • HDFS如何管理块大小?

    我的文件大小为 65MB 默认 hdfs 块大小 64MB 那么将分配多少个 64MB 块给我的文件 是 1 64MB 块 1 1MB 块还是 2 64MB 块 如果是 2 64MB 块 剩下的 63MB 会被浪费还是会分配给其他文件 块大
  • 从 mJSP 页面获取 URL

    我将获取当前 JSP 网页的 URL 及其设置 示例 index jsp 参数 12 你有什么想法吗 谢谢 您可以从HttpServletRequest http download oracle com javaee 6 api javax
  • 将路径宽度更改为 svg 容器的 100%

    我有一个 svg 背景图像 但路径不是 100 的 svg 宽度 我也尝试过更改 keepaspectratio 但没有成功
  • Logstash:如何将文件名添加为字段?

    我使用 Logstash Elasticsearch Kibana 来概览我的 Tomcat 日志文件 对于每个日志条目 我需要知道它来自的文件的名称 我想将其添加为字段 有办法做到吗 我用谷歌搜索了一下 只发现这个问题 https sta
  • 使用 Python Requests 库上传大型 XML 文件

    我正在尝试用 Python 和 requests 库替换curl 借助curl 我可以使用curl T 选项将单个XML 文件上传到REST 服务器 我无法对 requests 库做同样的事情 一个基本场景的工作原理 payload
  • 如何在java中实用地从jar中删除特定文件/文件夹

    如何在 java 中实用地从 jar 中删除特定文件 文件夹 我有一个 jar ABC jar 包含文件 文件夹和另一个 jar 说 child jar 在child jar下我想删除一个特定的文件 我能怎么做 这样我的 ABC jar 结
  • Hibernate Map ID 自动从字段中获取

    我有类似的东西 Entity Table name claim schema test public class Claim implements Serializable Id GeneratedValue strategy Genera
  • 使用 python 获取 Windows 资源管理器中所选文件的路径

    我想在桌面上选择一些文件 然后使用 python 脚本 将通过键盘组合按下启动 获取所有选定文件的路径 我知道如何通过组合键触发脚本 但我的文件路径有问题 任何帮助将不胜感激 我明白pyHook仅读取低级键盘事件 你想做的是不可能用你的方法
  • 如何在 Web 组件中使用子元素

    我正在构建用于教育目的的普通 Web 组件 这是我的自定义复选框 class Checkbox extends HTMLElement constructor super this shadow this attachShadow mode
  • WCF OData 服务和 EF 6 问题 - 无法使用 Odata 服务公开实体

    我将 WCF 数据服务 Odata 与 NET Framework 4 5 1 和 EF 6 1 结合使用 我使用代码优先方法来创建 EF 模型 当我将此 EF 模型 AddProjectModel cs 引用到 WCF OData 服务
  • 在 Eclipse 中创建方法存根的快捷方式

    我认为在 Eclipse 中创建方法存根的一些快捷方式可能会有用 有谁知道该怎么做 Type public method see Java Editor Templates in preferences for more options o
  • 检测 Java 对象是否已被修改?

    假设我有一个标准 Java bean 即它包含的成员是String List HashMap etc 我的问题是 检测此类对象的实例是否已从先前 原始状态进行修改的最简单方法是什么 我想知道这一点的原因是 在以下情况下 我可以确定是否应该更
  • 重新加载 vue-tables-2 (Vuex) 的数据

    Module https github com matfish2 vue tables 2 https github com matfish2 vue tables 2 我正在创建一个 CRUD 应用程序 如何在 vue tables 2
  • 从 PHP 中的分隔字符串中提取浮点数

    我想将一串分隔的维度值转换为浮点数 例如 152 15 x 12 34 x 11mm into 152 15 12 34 and 11 并存储在一个数组中 这样 dim 0 152 15 dim 1 12 34 dim 2 11 我还需要处
  • 在放置新分配的对象时不调用析构函数可以吗?

    假设我有一个固定的内存缓冲区 char buffer And I 使用placement new 在该缓冲区中分配我的结构 struct S std tuple
  • 如果表单数据边界包含在附件中怎么办?

    让我们看下面的例子multipart form data 取自 w3 com http www w3 org TR html401 interact forms html h 17 13 4 2 Content Type multipart
  • 将模板应用于具有属性的子节点

    我想将模板应用于具有指定属性的子节点的节点 并且我很好奇是否可以使用
  • 获取 BQ 公共数据集中的顶级专利国家/地区和代码

    我正在尝试使用分析函数来获取专利申请量排名前 2 的国家 地区 并在这两个排名前 2 的国家 地区中获取排名前 2 的申请类型 例如 答案将如下所示 country code US P US A GB X GB P 这是我用来获取此信息的查
  • Caffe 模型为每个图像提供相同的输出

    我刚刚使用预定义的 prototxt 和 caffemodel 文件在 caffe 中加载了 alexnet 然而 将任何图像发送到模型都会返回与 fc7 层的输出相同的值 这是代码片段 net caffe Net alexnet trai
  • 使元素在 css 缩放后表现相同

    我一直在用 javascript 操作 div 有时我需要让这些 div 适合大小不断变化的容器 实现这一目标的一种方法是使用 css 缩放 缩放的问题在于它只是缩小了元素的图片 系统继续以相同的方式查看元素 因此所有位置等都会变得倾斜 例