小编Unt*_*hic的帖子

css显示表格单元格需要百分比宽度

我已被置于需要使用display:table-cell命令的div元素的位置.

但是我发现只有将百分比添加到宽度时,"单元格"才能正常工作.

在这个小提琴http://jsfiddle.net/NvTdw/当我删除百分比宽度时,单元格没有相等的宽度,但是当一个百分比值被添加到宽度时一切都很好,但只有当该百分比等于div的最大数量的比例,因此四列25%,五个20%,在这种情况下五个在16.666%.

我想可能会增加一个百分比 - 比如1%将是一个很好的修复所有,但细胞再次脱离线.

为什么是这样?

    .table {
      display: table;
      height: 200px;
      width: 100%;
    }

    .cell {
      display: table-cell;
      height: 100%;
      padding: 10px;
      width: 16.666%;
    }

    .grey {
      background-color: #666;
      height: 100%;
      text-align: center;
      font-size: 48px;
      color: #fff;
      font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
      font-weight: 300;
    }
Run Code Online (Sandbox Code Playgroud)
<div class="table">
  <div class="cell">
    <div class="grey">Block one</div>
  </div>
  <div class="cell">
    <div class="grey">Block two</div>
  </div>
  <div class="cell">
    <div class="grey">Block three</div>
  </div>
</div>
<div class="table">
  <div class="cell">
    <div class="grey">Block</div>
  </div>
  <div class="cell"> …
Run Code Online (Sandbox Code Playgroud)

html css css-tables

57
推荐指数
1
解决办法
10万
查看次数

如何更新或覆盖 woocommerce wc-template-functions 中的不可插入函数

我正在 woocommerce 中构建一个主题,我需要对woocommerce_output_all_notices()in的 html 输出进行一些小更改wc-template-functions.php。现有的函数本身是这样的:

function woocommerce_output_all_notices() {
    echo '<div class="woocommerce-notices-wrapper">';
    wc_print_notices();
    echo '</div>';
}
Run Code Online (Sandbox Code Playgroud)

我想做的只是<span>在 div 内添加一个 id 或 data 属性和 a ,但不直接编辑代码(我显然不想这样做),我很困惑,因为它似乎不是一个可插入函数,但我没有看到一种可以为此使用钩子的方法。

php woocommerce

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

添加thead并从tbody插入第一个tr,仅用于父表

我必须使用tbody的第一行创建一个thead。我没有对标记的完全控制权,所以我使用jQuery来做到这一点。

我已经成功使用了一些借来的脚本,但是当我在页面中添加多个表时,第一行似乎在以下表中重复

我想我需要以父表为目标,通常我会给每个表一个ID,但是我不能,因为它们是为我生成的。

在这个小提琴中可以看到正在发生的事的一个例子http://jsfiddle.net/FGH6B/

我当前的jQuery如下

jQuery("document").ready( function() {

    var mytable = $("table"); 

    mytable.prepend(document.createElement('thead'));

    $("table thead").append($("tbody tr:eq(0)"));

});
Run Code Online (Sandbox Code Playgroud)

html jquery html-table semantic-markup

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

单击切换下拉菜单

我正在尝试创建一个下拉菜单,该菜单会在点击时激活,而不是在悬停时激活.到目前为止,我点击了使用一个小的javascript,但是子菜单显示良好,如果点击其他菜单隐藏其他子菜单,我无法弄清楚如果单击其父菜单如何隐藏子菜单.

EG在这个JS小提琴中 我可以点击"父母1"来揭示它的孩子,当我点击"父母2"父母1的孩子隐藏和父母2的孩子显示.但是,如果父母1的孩子表明我希望能够通过再次点击父母1来隐藏他们(或者甚至更好地在孩子外面的任何地方)

我已经看到了一些示例,其中每个父级和子菜单都有单独的类或ID.我想避免这种情况,因为它需要在cms中工作.

这是我的基本代码

HTML:

<div>
<ul>
    <li><a href="#">Parent 1</a>
        <ul>
            <li><a href="#">Parent 1 &raquo; Child 1</a></li>
            <li><a href="#">Parent 1 &raquo; Child 1</a></li>
            <li><a href="#">Parent 1 &raquo; Child 1</a></li>
        </ul>
    </li>
    <li><a href="#">Parent 2</a>
        <ul>
            <li><a href="#">Parent 2 &raquo; Child 2</a></li>
            <li><a href="#">Parent 2 &raquo; Child 2</a></li>
            <li><a href="#">Parent 2 &raquo; Child 2</a></li>
        </ul>
    </li>
    <li><a href="#">Parent 3</a>
        <ul>
            <li><a href="#">Parent 3 &raquo; Child 3</a></li>
            <li><a href="#">Parent 3 &raquo; Child 3</a></li>
            <li><a href="#">Parent 3 &raquo; Child 3</a></li>
        </ul> …
Run Code Online (Sandbox Code Playgroud)

javascript jquery menu toggle drop-down-menu

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