Question

我有我的产品页面。那边的面包屑以这种格式显示

Home > TORNADO > Chicken Smoked Pizza >

我希望它采用这种格式

Home > TORNADO > Chicken Smoked Pizza

我最后不想要＆gt; 。

我将如何实现这一目标？

这是我的css

.breadcrumb {
margin: 20px 0;
padding: 10px 0;
}
.breadcrumb i {
    font-size: 15px;
}
.breadcrumb .fa {
    color: #111;
}
.breadcrumb > li {
    text-shadow: 0 1px 0 #FFF;
    padding: 0 20px;
    position: relative;
    white-space: nowrap;
}
.breadcrumb > li a {
    color: #888888;
}
.breadcrumb > li a:hover {
    color: #111;
}
.breadcrumb > li + li:before {
    content: '';
    padding: 0;
}
.breadcrumb > li:after {
    content: '';
    display: block;
    position: absolute;
    top: 8px;
    right: -5px;
    width: 6px;
    height: 6px;
    border-right: 1px solid #BBB;
    border-bottom: 1px solid #BBB;
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    transform: rotate(-45deg);
}
.pagination {
    margin: 0;
}

这是我的控制器，我在创建面包屑

$data['breadcrumbs'][] = array(
                'text' => $this->model_multirestaurant_restaurant->getRestaurantName($this->session->data['r_id']),
                'href' => $this->url->link('restaurant/listing/detail', '&id=' . $this->session->data['r_id'])
            );

            $data['breadcrumbs'][] = array(
                'text' => $product_info['name'],
                'href' => $this->url->link('product/product', $url . '&product_id=' . $this->request->get['product_id'])
            );

这是我在tpl文件中的循环

<ul class="breadcrumb">
    <?php foreach ($breadcrumbs as $breadcrumb) { ?>
    <li><a href="<?php echo $breadcrumb['href']; ?>"><?php echo $breadcrumb['text']; ?></a></li>
    <?php } ?>
  </ul>

Answer 1

如果您通过css添加（通过一些评论/答案后确认），请通过css将其删除：

.breadcrumb > li:last-child:after {
    border:none;
}

有关:last-child的更多信息：

https://developer.mozilla.org/en-US/docs/Web/CSS/%3Alast-child

示例fiddle

Answer 2

如果文本中有>，请使用PHP trim()（请参阅here）

修改：我看到您现在使用循环，并使用css生成>。

你现在使用css放置>，我建议在循环中使用文本。请参阅我的更新答案（在循环中添加>作为文本）。

要仅使用css进行修复，请参阅 @Niranjan N Raju 他的答案。

<ul class="breadcrumb">
    <?php 
    $bcount = count($breadcrumbs);
    for ($i=0; $i<$bcount; $i++){
        if ($i<$bcount-1){
        ?>
         <li><a href="<?php echo $breadcrumbs[$i]['href']; ?>"><?php echo $breadcrumbs[$i]['text']; ?> > </a></li>
        <?php
        }
        else{
        ?>
         <li><a href="<?php echo $breadcrumbs[$i]['href']; ?>"><?php echo $breadcrumbs[$i]['text']; ?></a></li>
        <?php
        }
    } ?>
  </ul>

我认为内联html更为漂亮：

<?php echo '<ul class="breadcrumb">';
    $bcount = count($breadcrumbs);
    for ($i=0; $i<$bcount; $i++){
        if ($i<$bcount-1){
           echo '<li><a href="'. $breadcrumbs[$i]['href'].'">'.$breadcrumbs[$i]['text'].' > </a></li>';
        }
        else{
          echo '<li><a href="'.$breadcrumbs[$i]['href'];.'">'.$breadcrumbs[$i]['text'].'</a></li>';
        }
    }
  echo '</ul>';

Answer 3

将preg_replace与$

一起使用

$string = 'Home > TORNADO > Chicken Smoked Pizza >';
echo preg_replace('/>$/', '', $string);// echoes Home > TORNADO > Chicken Smoked Pizza

请参阅演示here

修改

ul.breadcrumb li:last-child { content: none; }

工作Demo

我想使用CSS从上一个<li>中删除箭头符号

3 个答案: