使用CSS和HTML有很多答案可以在某些文本的两侧添加一行,但这些行总是填充容器的整个宽度.我只希望这些行在文本的两侧长度为150px,如下所示:

文本将是动态的,因此可能会改变长度并需要居中.

这是我一直在研究的一些jsfiddle代码:

https://jsfiddle.net/vh0j4q1e/

<div id="container">

文字标题

#container {
width:800px;
text-align:center;
background-color:#ccc;
}
h1 {
position: relative;
font-size: 30px;
z-index: 1;
overflow: hidden;
text-align: center;
}
h1:before, h1:after {
position: absolute;
top: 51%;
overflow: hidden;
width: 50%;
height: 3px;
content: '';
background-color: red;
}
h1:before {
margin-left: -50%;
text-align: right;
}

任何人都可以帮助改进此代码,以便按照上图显示线条？

我在运输区域内设置了两种统一费率运输方式。在结账时，这两种运输方式都可用。

我想在每个统一运费选项下显示文字说明。在 WooCommerce 中似乎没有任何选项可以做到这一点。

我已经尝试了以下代码，但不用说它不起作用：

add_filter( 'woocommerce_page_title', 'woo_shop_page_title');
function wc_get_shipping_zone( $package ) {

    if( $package == 'flat_rate:1') {
    return "<p>Arriving on your chosen date between 9am - 1pm Perfect for business addresses & special occasions</p>";
    }
    if( $package == 'flat_rate:2') {
    return "<p>Arriving on your chosen date between 9am - 7pm Perfect for residential addresses</p>";
    }
}

任何人都可以帮助完成这项工作吗？

这就是我希望结帐时的描述：

我正在尝试在 WordPress 菜单中的任何子菜单项之后添加一个 div。我正在处理functions.php文件中的以下代码：

add_filter( 'nav_menu_link_attributes', 'SubMenuCheck', 10, 3 );
function SubMenuCheck( $atts, $item, $args ) {
  if (in_array('menu-item-has-children', $item->classes)) {
    $args->after = '<div class="click">+</div>';
  }
  return $atts;
}

上面的代码添加了新的 div，<div class="click">+</div>但在第一个“menu-item-has-children”类之后继续将其应用于所有父项和子项：

有谁知道为什么这是重复的？...我只希望 div 显示menu-item-has-children该类的项目。

谢谢

我有一个同类的div列表.每个div都有一个我需要添加小数位的数字.html是这样的:

<div class="demo">14214</div>
<div class="demo">23455</div>
<div class="demo">45645</div>
<div class="demo">76554</div>
<div class="demo">77655</div>

我需要使用jQuery返回结果:

<div class="demo">14.214</div>
<div class="demo">23.455</div>
<div class="demo">45.645</div>
<div class="demo">76.554</div>
<div class="demo">77.655</div>

我一直在研究的jQuery代码是:

$.each($('.demo'), function (index, value) { 

var number = parseInt($(this).text());
var addcommas = new Intl.NumberFormat().format(number);

var adddots = addcommas.toString().replace(',', '.');

$(this).innerHTML = adddots;

});

JS小提琴

有人可以帮忙吗？

我遇到页面标题文本出现在 h3 标签之外的问题。

我正在使用的 PHP 是：

$pagetitle = woocommerce_page_title();
echo '<h3>' . $pagetitle . '</h3>';

这是这样的渲染：

Shop
<h3></h3>

我希望它是这样的：

<h3>Shop</h3>

如果我只是使用：

$pagetitle = Shop;
echo '<h3>' . $pagetitle . '</h3>';

它工作正常。有谁知道是什么导致了这个问题？