PageKit — 可自托管的 GrapesJS 建站工具,附完整源码。 获取抢先体验

问题 #2057💬 已回答提出于 2019年5月31日作者 alikabeer321 个反应

媒体查询不适用于我编写的自定义块

快速解答作者 alikabeer32❤ 1

@alikabeer32我也遇到同样的问题。如果你解决了这个问题。你能在这里分享一下解决方案吗?谢谢 @umerrinayat我不记得我做了什么,但试试以下方法: 你需要定义 CSS 类并添加唯一的 ID “''js const cssComposer = 编辑器。Css作曲家; var SM = 编辑。选拔经理; var sel1 = sm.add('simple-div'); var rule = cssComposer.add([sel1]); 更新风格 rule.set('style', { 宽度:“100%”, 高度:“自动” “填充”:'80px 50px', 高度:“自动” float:“左”, }); 添加唯一ID...

阅读下方完整回答 ↓

问题

我写了一个简单的 div 块,就像这样 blockManager.add('simple-div', { 标签:“容器”, 内容:“<!––<div class=”simple-div“></div> ––>”“, 分类:“基础”, 属性:{ 标题:“简单盒子”, 类别:“FA方阵” } });

但它完全没有响应。情况是这样的:

  1. 我在桌面上把宽度设置为100%
  2. 我切换到平板,把宽度调成50%
  3. 我切回桌面,宽度依然是50% CSS 中也没有媒体查询 (媒体查询对图片正常使用)

我是不是漏掉了什么代码,能让它响应式?

编辑

我刚意识到,样式是针对元素本身,而不是唯一ID/职业 我用以下代码为该元素赋予了唯一 ID var comps = 编辑器。主导组件;

comps.addType('.simple-div', { 初始化:function() { this.set('attributes', { id: randomID() }); }, });

我该如何让样式不直接进入元素,而是内联样式表

回答(2)

alikabeer32• 2019年12月6日

@alikabeer32我也遇到同样的问题。如果你解决了这个问题。你能在这里分享一下解决方案吗?谢谢 @umerrinayat我不记得我做了什么,但试试以下方法: 你需要定义 CSS 类并添加唯一的 ID “''js const cssComposer = 编辑器。Css作曲家; var SM = 编辑。选拔经理; var sel1 = sm.add('simple-div'); var rule = cssComposer.add([sel1]); 更新风格 rule.set('style', { 宽度:“100%”, 高度:“自动” “填充”:'80px 50px', 高度:“自动” f...

umerrinayat• 2019年12月6日

@alikabeer32我也遇到同样的问题。如果你解决了这个问题。你能在这里分享一下解决方案吗?谢谢

相关问答

通过相似的问题讨论继续研究。

与此问题匹配的付费插件

根据问题关键词和标签相关性精选,助你更快交付。

查看全部插件

正在加载付费插件推荐……

免费方案

在以下平台查看开源 GrapesJS 插件: GitHub 或在我们的免费目录中快速搜索。

浏览免费插件 →
高级方案

高级插件提供支持、定期更新和生产就绪的功能——为你节省数天的集成工作。

浏览高级插件 →

浏览插件分类

直接跳转到市场上的插件分类页面。