如何使滑块箭头更高

Question

我想创建更高的滑块箭头。我想让它们垂直拉伸。我使用名为 SmartSlider 的 WordPress 插件。我已经尝试使用 CSS :

.nextend-arrow{
    width:100px!important;
    height:100px!important;
}

我在插件的网站上找到了它。当我仅将高度更改为大于宽度时，箭头仍保持以前的大小... 我也尝试使用 :

.nextend-arrow{
        height:100%!important;
    }

这是上一个箭头（来自Chrome检查）：

<div data-ssleft="0+15" data-sstop="height/2-previousheight/2" id="n2-ss-7-arrow-previous" class="n2-ss-widget n2-ss-widget-display-desktop n2-ss-widget-display-tablet n2-ss-widget-display-mobile n2-style-15840d24d130269e6b64e6608dab2b08-heading nextend-arrow n2-ow nextend-arrow-previous  nextend-arrow-animated-fade n2-ib" style="position: absolute; width: 22.4px; height: 280px; top: 2.5px; left: 15px;" role="button" aria-label="Previous slide" tabindex="0"><img class="n2-ow" data-no-lazy="1" data-hack="data-lazy-src" src="data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzIiIGhlaWdodD0iMzIiIHZpZXdCb3g9IjAgMCAzMiAzMiIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJNMTEuNDMzIDE1Ljk5MkwyMi42OSA1LjcxMmMuMzkzLS4zOS4zOTMtMS4wMyAwLTEuNDItLjM5My0uMzktMS4wMy0uMzktMS40MjMgMGwtMTEuOTggMTAuOTRjLS4yMS4yMS0uMy40OS0uMjg1Ljc2LS4wMTUuMjguMDc1LjU2LjI4NC43N2wxMS45OCAxMC45NGMuMzkzLjM5IDEuMDMuMzkgMS40MjQgMCAuMzkzLS40LjM5My0xLjAzIDAtMS40MmwtMTEuMjU3LTEwLjI5IiBmaWxsPSIjMzcyZjJmIiBvcGFjaXR5PSIwLjUxIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiLz48L3N2Zz4=" alt="previous arrow" style="width: 100%;"></div>

<img class="n2-ow" data-no-lazy="1" data-hack="data-lazy-src" src="data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzIiIGhlaWdodD0iMzIiIHZpZXdCb3g9IjAgMCAzMiAzMiIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJNMTEuNDMzIDE1Ljk5MkwyMi42OSA1LjcxMmMuMzkzLS4zOS4zOTMtMS4wMyAwLTEuNDItLjM5My0uMzktMS4wMy0uMzktMS40MjMgMGwtMTEuOTggMTAuOTRjLS4yMS4yMS0uMy40OS0uMjg1Ljc2LS4wMTUuMjguMDc1LjU2LjI4NC43N2wxMS45OCAxMC45NGMuMzkzLjM5IDEuMDMuMzkgMS40MjQgMCAuMzkzLS40LjM5My0xLjAzIDAtMS40MmwtMTEuMjU3LTEwLjI5IiBmaWxsPSIjMzcyZjJmIiBvcGFjaXR5PSIwLjUxIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiLz48L3N2Zz4=" alt="previous arrow" style="width: 100%;">

Img 在 div 里面。

和图像： Slider

我希望这些箭头几乎和滑块一样高，但又像现在一样细。

这是我的第一个post，抱歉我语言不通，感谢您的帮助。

Answer 1

我会为他们创建一个容器。给容器一个position: relative;，箭头一个position: absolute;，那么你可以使用100%。

height: 100%; 目前无法正常工作的原因是浏览器不知道将 100% 与什么进行比较，因为父元素没有给定的 height。

如何使滑块箭头更高

How to make slider arrows taller

html

css

wordpress

arrows

slider