小编Bea*_*iie的帖子

使用CSS按比例更改图像大小?

我已经尝试了几天来配置我的缩略图库,所以所有图像都显示相同的高度和宽度.但是当我将Css代码更改为时,

max-height: 150px;
max-width: 200px;
width: 120px;
height: 120px;
Run Code Online (Sandbox Code Playgroud)

我得到的图像大小都相同,但纵横比被拉伸毁了图像.有没有办法调整图像容器的大小而不是图像?让我保持纵横比.但仍然调整图像大小.(我不介意我切掉一些图像.)

提前致谢!

html css gallery lightbox

97
推荐指数
6
解决办法
59万
查看次数

Clean Gatsby 5.2 安装为 `react-server-dom-webpack` 抛出 `NPM WARN` 标志

使用 进行干净的 Gatsby 5.2 安装后Gatsby CLI,我需要帮助理解我的终端输出,其中显示了大量NPM WARN标志。

我有三个问题;

  1. 造成这些错误的原因是什么?
  2. 为什么全新安装时会发生这些错误?
  3. 解决此类问题的首选方法是什么?

我在这里问这些问题是因为我想先发制人地学习如何正确理解和处理它们。

我在这里阅读了一些类似的问题,其中一些建议使用该--legacy-peer-deps标志。

我理解为什么有人可能--legacy-peer-deps一般使用该标志,但我很难理解为什么新版本,即(Gatsby 5.0),需要使用--legacy-peer-deps.

NPM 错误仍然是我的痛点,所以我正在寻找易于理解的阅读材料。或者如果可能的话,提供全面的解释。

运行后:gatsby info --clipboard

% gatsby info --clipboard

  System:
    OS: macOS 13.0.1
    CPU: (16) x64 Intel(R) Xeon(R) W-2140B CPU @ 3.20GHz
    Shell: 5.8.1 - /bin/zsh
  Binaries:
    Node: 18.12.1 - ~/.nvm/versions/node/v18.12.1/bin/node
    npm: 8.19.2 - ~/.nvm/versions/node/v18.12.1/bin/npm
  Browsers:
    Chrome: 108.0.5359.98
    Safari: 16.1
  npmPackages:
    gatsby: ^5.2.0 => 5.2.0
    gatsby-plugin-image: ^3.2.0 => 3.2.0
    gatsby-plugin-manifest: …
Run Code Online (Sandbox Code Playgroud)

npm graphql

15
推荐指数
2
解决办法
2454
查看次数

将!important应用于所有JS样式的ele。好主意还是不?

因此,由于某些不利的原因,我无法直接访问css或H​​TML,因此在某些复选框上设置几种样式时遇到了一些麻烦。但是,我可以使用Pure Javascript影响我的项目。

我建立了一个基本功能,旨在用两种样式来设置页面上所有复选框的样式。float: left; & marginRight: 1em。我包括了一个小片段,显示了我的劳动成果。

function styleEl() {
  // get all elements...
  var bxSyl = document.querySelectorAll('input[type=checkbox]');

  // console.log(bxSyl);

  [].forEach.call(bxSyl, function(bs) {
    // style elements...
    bs.style.cssFloat = "left";
    bs.style.marginRight = "1em";
  });
};

// call it...
styleEl();
Run Code Online (Sandbox Code Playgroud)
.editoropt {
  font-family: Calibri, sans-serif;
  width: 300px;
  background: #0f0;
  padding: .5em;
}
Run Code Online (Sandbox Code Playgroud)
<div class="seq-box-form-field  editoropt  ">
  <label for="opt1"><span style="padding-right: 10px; vertical-align: 1px;">Ground Floor </span>
    <input type="checkbox" name="checkboxopt" id="checkboxopt" value="true" checked="true" />
    <input type="hidden" name="opt1" id="opt1" value="true" />
  </label>
</div>

<div …
Run Code Online (Sandbox Code Playgroud)

javascript css

5
推荐指数
1
解决办法
212
查看次数

Prestashop 1.6.1.11(500)内部服务器错误(关联)字节已用尽

我已经在Prestashop论坛上发布了一个问题一段时间,关于一个我不确定如何解决的问题.我会将下面的链接发布到原始问题,我将非常感谢您就此问题获得的任何帮助.

初步Prestashop论坛问题.


Prestashop 1.6.1.11:每次我访问某些产品并尝试编辑他们的关联时,我都会收到错误通知;

(500内部服务器错误)

加载选项卡时发生服务器错误:无法加载某些选项卡.请刷新页面再试一次.如果您仍然遇到此问题,请检查您的服务器日志或联系您的托管服务提供商以获取帮助.

我完成了几个步骤,尝试识别错误,如下面的代码片段所示,结果我能够返回一些有关错误的详细信息.

<php

// I enabled dev mode via config/defines.inc.php
if (!defined('_PS_MODE_DEV_')) {
define('_PS_MODE_DEV_', true);
}

?>
Run Code Online (Sandbox Code Playgroud)

重新跟踪我试图重现错误的步骤.

这是我的结果......

致命错误:第69行的/classes/cache/CacheFs.php中允许的内存大小为134217728个字节(尝试分配8192个字节)

我向前迈了几步,希望能够纠正这个问题,但一切都无济于事.我将列出我在下面尝试的步骤;

  • 调整我的php.ini以允许完整的内存限制,我将发布下面的完整副本. (memory_limit = 128M)
  • 联系我的托管服务提供商,在我的服务器上安装了"xCache"缓存模块,希望能绕过默认的缓存解决方案并找到可能的修复方法.但是目前这是不可能的.
  • 检查最近安装的模块问题.(没有找到)


我已经在网上进行了一些进一步的挖掘,但大多数解决方案看起来很普遍,例如重建代码以减少内存密集.可悲的是,我对我用现有知识可靠地解决这个问题的能力不够自信,我正在寻求关于如何解决这个错误的一些建议.

问候,-B

编辑

进一步挖掘后和禁用缓存后,我的错误位置已更改为; Adapter/Adapter_EntityMapper.php on line 98.

php caching prestashop

5
推荐指数
1
解决办法
2371
查看次数

如何限制 WP 中的手动摘录长度?

可以使用以下代码段控制WP 帖子的 WP 默认(自动)摘录长度functions.php;

来自WP Codex

// . Post excerpt adjustment (Auto)
// . ==============================
function wpdocs_custom_excerpt_length( $length ) {
    return 20;
}
add_filter( 'excerpt_length', 'wpdocs_custom_excerpt_length', 999 );
Run Code Online (Sandbox Code Playgroud)

我的问题是您如何限制手动操作?

您知道吗,用户自己专门添加的摘录?

(*)有一个8岁的问题在这里,这并提供一些背景但考虑到目前一年进步WP取得了我想再次发布问题并获得一些关于这个问题的清晰度。

添加上下文:(编辑:2019 年 3 月 12 日)

并不是说之前发布的问题的原始答案不起作用,但看起来确实很笨拙。我正在寻找使用exerpt_length过滤器的更简单和可靠的答案。而不是使用类似以下内容来修剪文本;(如果可能)

function excerpt($limit) {
    return wp_trim_words(get_the_excerpt(), $limit);
}
Run Code Online (Sandbox Code Playgroud)

php wordpress function

5
推荐指数
1
解决办法
1418
查看次数

Bootstrap 4 是否可以向列添加装订线?

我一直在网上搜索寻找答案,但我似乎无法找到有关在 BS4 中向列添加排水沟的答案。我发现任何关于添加排水沟的文章都引用了 BS3。甚至 BS4 Docs 都在谈论删除它们,但据我所知,没有,对吗?

甚至可以添加不会导致 cols 断裂和包装的相等的排水沟吗?如果是这样,您将如何在不弄乱 flex box 的情况下做到这一点?

我有一个JsFiddle展示了我试图向其中添加排水沟的网格。我能得到任何帮助,或者即使我能指出正确的方向,我也会很感激。

.sec-accent {
  background-color: #fafcf5;
}

.blue {
  background-color: #9999cc;
}
Run Code Online (Sandbox Code Playgroud)
<div class="container">
    <div class="row">
      <div class="col-sm-12 blue" style="height:500px;">
        Hello World
      </div>
    </div>

    <div class="row">
      <div class="col-sm-4 blue" style="height:500px;">
        Hello World
      </div>
      <div class="col-sm-8 blue" style="height:500px;">
        Hello World
      </div>
    </div>

    <div class="row">
      <div class="col-sm-4 blue" style="height:500px;">
        Hello World
      </div>
      <div class="col-sm-4 blue" style="height:500px;">
        Hello World
      </div>
      <div class="col-sm-4 blue" style="height:500px;">
        Hello World
      </div>
    </div>

    <div …
Run Code Online (Sandbox Code Playgroud)

html css bootstrap-4

4
推荐指数
1
解决办法
8635
查看次数

显示字符数,'内部'HTML Textarea元素

我正在寻找在HTML文本区域内嵌入char-count值,就像下面的图像一样.我仍然是Js新秀,所以任何建议都非常受欢迎.我做了一些挖掘,并没有真正遇到任何可以真正帮助我的东西.

由于我无法直接访问CSS或HTML文件,因此我必须通过Js来定位这些元素.我的问题是可以像下面这样的图像,完全用Js完成吗?如果是这样我从哪里开始?

元素ID' = 'desinp' 我将包括我当前的JsFiddle,我现在拥有的东西.

字数计数示例.

html javascript

1
推荐指数
2
解决办法
2034
查看次数

Bootstrap 4 - 页面加载时关闭自定义动画汉堡包图标?

我可能会default-toggler以更老的方式使用以下引导程序,但我无法弄清楚为什么我的自定义编辑强制按钮加载关闭?

[如'X']

这可能是一个菜鸟错误和我对BS4显示的经验不足,但如果有人能提供一些建议,我将不胜感激.

下面是一个演示JS Fiddle的完整编辑.

HTML

<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation">
   <span class="icon-bar top-bar"></span>
   <span class="icon-bar middle-bar"></span>
   <span class="icon-bar bottom-bar"></span>
   <span class="sr-only">Toggle navigation</span>
</button>
Run Code Online (Sandbox Code Playgroud)

CSS

.navbar-toggler {
  border: none;
  background: transparent !important;
}
.navbar-toggler:focus {
  outline: none;
  background: transparent !important;
}

.navbar-toggler .icon-bar {
  background-color: #fff;
  transform: rotate(0deg) translate(0px, 0px);
  transition: ease all .2s;
}

.navbar-toggler .icon-bar {
  display: block;
  width: 22px;
  height: 2px;
  border-radius: 1px;
}

.navbar-toggler .icon-bar + .icon-bar { …
Run Code Online (Sandbox Code Playgroud)

html css bootstrap-4

1
推荐指数
1
解决办法
7320
查看次数

预加载器未捕获的错误“ e.indexOf-不是函数”。

我在Jquery中的实力不如我想要的强,并且我认为我无法正确理解此错误。我的所有Google搜索几乎都显示了此错误的复杂示例。

如果有人能指出正确的方向来解决以下错误并提供一些背景信息,我将不胜感激。

应该澄清一下,第565行是我的脚本开始的位置。 $(window).load(function()

>// From the console
>
>(jquery-3.3.1.min.js:2)
>
> *Uncaught TypeError: e.indexOf is not a function at w.fn.init.w.fn.load  at index.html:565*
Run Code Online (Sandbox Code Playgroud)

>// From the console
>
>(jquery-3.3.1.min.js:2)
>
> *Uncaught TypeError: e.indexOf is not a function at w.fn.init.w.fn.load  at index.html:565*
Run Code Online (Sandbox Code Playgroud)
<!-- Loader Script -->
$(window).on('load', function() {
  setTimeout(function() {
    $("body").addClass("hidden")
  }, 100);
  setTimeout(function() {
    $(".preloader").addClass("end")
  }, 1800);
  setTimeout(function() {
    $(".global-overlay").addClass("show")
  }, 1900);
  setTimeout(function() {
    $("body").removeClass("hidden")
  }, 2300);
});
Run Code Online (Sandbox Code Playgroud)
.no-js #loader {
      display: none;
    }

    /*Negative delay values skip …
Run Code Online (Sandbox Code Playgroud)

html css jquery

1
推荐指数
1
解决办法
2778
查看次数