---
url: 'https://dxpr.com/zh-hans/hc/documentation/learn-dxpr-builder/troubleshooting/elements-look-wrong'
title: '元素显示或行为异常 | DXPR'
author:
  name: Jurriaan
  url: 'https://dxpr.com/users/jurriaan'
date: '2026-10-24T08:22:51+00:00'
copyright: 'Copyright DXPR. All rights reserved.'
type: article
summary: |-
  修复最常见的元素问题。开始前，先在新的空白页面上测试元素，以排除周围内容的影响。
  在某些设备上隐藏后行布局损坏
  该 响应式可见性 以下位置下的选项 HTML classes 是 Bootstrap 显示类，例如 d-none d-md-block。在行上它们替换行自己的布局，因此列堆叠。将类放在列上，或行周围的版块上。
  控制台显示 Bootstrap 需要低于版本 4 的 jQuery
  您的主题加载 Bootstrap 3 或 4 JavaScript，拒绝与近期 Drupal 11 版本附带的 jQuery 4 一起运行。DXPR Builder 本身不使用 jQuery。
tags:
  - 'Een probleem oplossen'
image: 'https://dxpr.com/themes/custom/dxpr_com/images/dxpr-share-card.jpg'
published: true
og:
  site_name: DXPR
  updated_time: '2026-10-24T08:22:51+0000'
  'image:alt': 'DXPR, powered by Drupal: AI-powered Drupal for marketers.'
schema:
  '@context': 'https://schema.org'
  '@graph':
    -
      mainEntity: {  }
    -
      '@type': TechArticle
      headline: 元素显示或行为异常
      description: |-
        修复最常见的元素问题。开始前，先在新的空白页面上测试元素，以排除周围内容的影响。
        在某些设备上隐藏后行布局损坏
        该 响应式可见性 以下位置下的选项 HTML classes 是 Bootstrap 显示类，例如 d-none d-md-block。在行上它们替换行自己的布局，因此列堆叠。将类放在列上，或行周围的版块上。
        控制台显示 Bootstrap 需要低于版本 4 的 jQuery
        您的主题加载 Bootstrap 3 或 4 JavaScript，拒绝与近期 Drupal 11 版本附带的 jQuery 4 一起运行。DXPR Builder 本身不使用 jQuery。
      image:
        '@type': ImageObject
        url: 'https://dxpr.com/themes/custom/dxpr_com/images/dxpr-share-card.jpg'
        width: '1200'
        height: '630'
      datePublished: '2026-10-24T08:22:51+0000'
      dateModified: '2026-10-24T08:22:51+0000'
      author:
        '@type': Organization
        '@id': 'https://dxpr.com/#organization'
        name: DXPR
        url: 'https://dxpr.com/'
        logo:
          '@type': ImageObject
          url: 'https://dxpr.com/themes/custom/dxpr_com/dxpr-logo-dark.svg'
          width: '1348'
          height: '501'
      publisher:
        '@type': Organization
        '@id': 'https://dxpr.com/#organization'
        name: DXPR
        url: 'https://dxpr.com/'
        logo:
          '@type': ImageObject
          url: 'https://dxpr.com/themes/custom/dxpr_com/dxpr-logo-dark.svg'
          width: '1348'
          height: '501'
      mainEntityOfPage: 'https://dxpr.com/zh-hans/hc/documentation/learn-dxpr-builder/troubleshooting/elements-look-wrong'
      articleSection: 'Een probleem oplossen'
    -
      '@type': WebPage
      '@id': 'https://dxpr.com/zh-hans/hc/documentation/learn-dxpr-builder/troubleshooting/elements-look-wrong'
      description: |-
        修复最常见的元素问题。开始前，先在新的空白页面上测试元素，以排除周围内容的影响。
        在某些设备上隐藏后行布局损坏
        该 响应式可见性 以下位置下的选项 HTML classes 是 Bootstrap 显示类，例如 d-none d-md-block。在行上它们替换行自己的布局，因此列堆叠。将类放在列上，或行周围的版块上。
        控制台显示 Bootstrap 需要低于版本 4 的 jQuery
        您的主题加载 Bootstrap 3 或 4 JavaScript，拒绝与近期 Drupal 11 版本附带的 jQuery 4 一起运行。DXPR Builder 本身不使用 jQuery。
      breadcrumb:
        '@type': BreadcrumbList
        itemListElement:
          -
            '@type': ListItem
            position: 1
            name: 首页
            item: 'https://dxpr.com/zh-hans'
      publisher:
        '@type': Organization
        '@id': 'https://dxpr.com/#organization'
        name: DXPR
      inLanguage: zh-hans
---
[Help Center](/zh-hans/node/75)/[Documentation](/zh-hans/hc/documentation) /[Learn DXPR Builder](/hc/documentation/learn-dxpr-builder) /[Manage the site](/hc/documentation/learn-dxpr-builder/manage) /[Een probleem oplossen](/hc/documentation/learn-dxpr-builder/troubleshooting) # 元素显示或行为异常.

 Learn DXPR BuilderManage the siteEen probleem oplossen

   ## In this guide

修复最常见的元素问题。开始前，先在新的空白页面上测试元素，以排除周围内容的影响。

## 在某些设备上隐藏后行布局损坏

该 **响应式可见性** 以下位置下的选项 **HTML classes** 是 Bootstrap 显示类，例如 `d-none d-md-block`。在行上它们替换行自己的布局，因此列堆叠。将类放在列上，或行周围的版块上。

## 控制台显示 Bootstrap 需要低于版本 4 的 jQuery

您的主题加载 Bootstrap 3 或 4 JavaScript，拒绝与近期 Drupal 11 版本附带的 jQuery 4 一起运行。DXPR Builder 本身不使用 jQuery。

1. 停止从主题加载 Bootstrap 3 或 4 JavaScript。
2. 如果主题未加载 Bootstrap 5，前往 **DXPR Studio** > **DXPR Builder** > **General Settings** > **Bootstrap** 并设置 **Sideload Bootstrap files** 为 **Bootstrap 5**.

**注意：** 该模块仅支持 Bootstrap 5。Bootstrap 3 或 4 主题需要迁移。

## 列在平板宽度下错位

网格有 12 列，因此五列不能相等。点击行的网格图标并选择预设，例如 **1/4 + 1/4 + 1/4 + 1/4** 或 **1/3 + 1/3 + 1/3**。要为平板设置专属布局，请点击 **Add screen size** 并从其列表中选择尺寸。

## Link 元素中的链接无反应

Link 元素本身是 `a` 标签，浏览器不允许链接嵌套链接。使用 Button，或带链接的 Text 元素。

## 锚链接落在固定页头下方

1. 前往 **General Settings** 并打开 **Advanced Settings**.
2. 设置 **Scroll offset selector** 到固定页头的 CSS 选择器。默认值覆盖 DXPR Theme 页头。
3. 为目标元素提供 **HTML ID**：**General** 面板的设置。

## 我的视频不自动播放

浏览器拒绝自动播放带声音的视频。在 Local video 设置中勾选 **Muted** 旁边 **Start playing automatically**并保存。

## 页面中的区块没有编辑控件

放置在页面中的 DXPR Builder 区块不显示自己的编辑器，因此您无法在其中更改内容。请在主题区域中该区块所在位置编辑它，位置为 **Structure** > **Block layout**，或改用 HTML 元素。

## 视图上的公开筛选器无反应

编辑器显示 "Turn on Ajax on this view to use exposed filters"。页面构建器内的过滤器仅通过 AJAX 工作。

1. 编辑视图并打开 **Advanced**.
2. 设置 **Use AJAX** 为 **Yes** 并保存视图。
3. 清除所有缓存。

## 脚本标签从我的 Text 元素中消失

页面构建器移除 `<script src>` 除 HTML 元素外每个元素的标签。将嵌入和脚本放入 HTML 元素。如果 **Apply text format filters to frontend content** 已打开，字段的文本格式也必须允许这些标签。

## 我的内容安全策略阻止编辑器

页面构建器内容将其样式保留在内联 `style` 属性，并且 **Asset source** 设为 **Cloud** 编辑器脚本从以下位置加载 `https://cdn2.dxpr.com`。允许 `'unsafe-inline'` ： `style-src`，并允许 `https://cdn2.dxpr.com` ： `script-src` 和 `style-src`.

## 确认修复

保存，然后通过以下方式检查元素 **View mode** 设为 **Preview**并以隐私窗口中的匿名访客身份。

## 接下来做什么？

[内容元素](/hc/documentation/learn-dxpr-builder/elements) 每个元素的设置。