小编dip*_*pas的帖子

我想创建一个如下所示的有序列表:

1. Item_1
2. Item_2:
    a. Subitem_1
    b. Subitem_2:
        I. Sub-Subitem_1
        II. Sub-Subitem_2
    c. Subtiem_3
3. Item 3

即子列表应使用字母/罗马数字或其他此类符号进行编号.

我尝试了嵌套<ol>标签,但明确编号了子列表.有没有办法只使用HTML？

小提琴(它是我实际代码的骨架):http://jsfiddle.net/nkipe/6bhee8c8/
代码:
CSS

* 
{
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    margin: 0; padding: 0;
}
html
{
    height: 100%;
}
body 
{
    height: 100%;
    background: #FEFFFB;
    font-family: arial, verdana;   
}
#layoutContainer 
{
    width: 100%;
    height: 100%;
    top: 0px;
    left: 0px;
    position: fixed;
}

#iframeHeader
{
    width: 100%;
    height: 50px;
    border: 0;
}
#iframeStatusBar
{
    width: 100%;
    height: 15px;
    border: 0;
}
#iframeMainMenu
{
    width: 200px;
    height: 100%;
}
#iframeCenterContent
{
    width: 100%;
    height: 100%;
    top: 65px; …

我创建了两个表,我想width根据第一个列的大小设置正确的3列.我试过calc((100% - 200px)/3)但它并不适用于所有浏览器:Firefox 40失败,IE11失败,Chrome 44似乎做得对.我该怎么做才能calc()在所有浏览器中理解？或者我应该忘记它？

我创建了一个更简单的版本,但也失败了.

<table class="tableauTable">
<thead>
    <tr class="tableauRow first">
        <th colspan="3" rowspan="2" class="tableauCell first"><span class="xspTextComputedField">Objet - Acteurs</span>
        </th>
        <th class="tableauCell header col3"><span class="xspTextComputedField">Julien GARDIN</span>
        </th>
        <th class="tableauCell header col3"><span class="xspTextComputedField">Justine VINCLAIR</span>
        </th>
        <th class="tableauCell header col3"><span class="xspTextComputedField">Marcel COMMAS</span>
        </th>
    </tr>
</thead>
<tfoot>
    <tr class="tableauRow first">
        <th colspan="3" header="" class="tableauCell first"></th>
        <th class="tableauCell header col3"><span class="xspTextComputedField">Julien GARDIN</span>
        </th>
        <th class="tableauCell header col3"><span class="xspTextComputedField">Justine VINCLAIR</span>
        </th>
        <th class="tableauCell header col3"><span class="xspTextComputedField">Marcel COMMAS</span>
        </th> …

在这里询问是因为我无法通过它传递正确的搜索查询。这是一个代码示例：

[class*="button_type"].state_2,
[class*="button_type"]:not(.state_2):hover{
    background-color:#fff;
}

此外，后缀有什么用:not？

我不明白为什么它不仅仅是：

.button_type.state_2,
.button_type:hover { etc..}

我form-control-feedback span从3.1.1 开始使用链接来执行javascript函数.我正在尝试升级到3.3.5,但form-control-feedback改变的行为.

请参阅Working JsFiddle 3.1.1

SNIPPET

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" rel="stylesheet" />
<div class="form-group has-feedback">
  <label class="control-label sr-only" for="rename"></label>
  <input value="hello" id="rename" type="text" maxlength="255" class="form-control name-check">
  <span class="form-control-feedback" style="top: 0px;right: 44px;">
    <a class="pointer" onclick="alert('I love u')"><small>cancel</small></a>&nbsp;<a class="pointer" onmousedown="save=true;" click="alert('i love u too')"><small><i>save</i></small></a> 	
  </span>
</div>

和不工作的JsFiddle 3.3.5

SNIPPET

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet" />
<div class="form-group has-feedback">
  <label class="control-label sr-only" for="rename"></label>
  <input value="hello" id="rename" type="text" maxlength="255" class="form-control name-check">
  <span class="form-control-feedback" style="top: 0px;right: 44px;">
    <a class="pointer" onclick="alert('I love u')"><small>cancel</small></a>&nbsp;<a …

我对引导程序的网格布局有问题。当我将屏幕调整为较小的布局时，我的列彼此重叠。

我不确定是什么问题。

这是正在发生的事情的图片：

这是我的代码

<div class='container-fluid'>

  <div class="row"> <!-- 1 -->
    <div class="col-sm-5 col-md-4">
      <h1>JOHN SMITH</h1>
    </div>
  </div>

  <div class='row'> <!-- 2 -->
    <div class="col-sm-5 col-md-4">
      <h2>VULCAN FLATBED</h2>
    </div>
  </div>

  <div class="row"> <!-- 3 -->
    <div class="col-sm-4 col-md-4 col-lg-4" style="background-color:yellow;">

      <div class='row'>
          <img src="vulcan.jpg" alt="vehicle image" width='391'/>
      </div>
      <div class='row'>
        <button type='submit'>
          <img src="book_now_button@2x.png" alt="book now">
        </button>
      </div>

    </div>

    <div class="col-sm-8 col-md-8 col-lg-8" style="background-color:pink;"> <!-- RIGHT SIDE -->

      <div class='row'>

        <h3>CAN HELP WITH</h3>
        <p>LIFTING & YARD WORK</p>
      </div>
      <div class='row'> …

可以在calc表达式中使用n变量吗？

例如：

.child:nth-child(n) {
   margin-left: calc(n * 46px);
}

我的代码：

<div class="share-buttons">
  <div class="share-button-main"></div>
  <div class="share-button share-facebook">
    <img src="facebook.png" alt="" />
  </div>
  <div class="share-button share-whatsapp">
    <img src="whatsapp.png" alt="" />
  </div>
  <div class="share-button share-email">
    <img src="email.png" alt="" />
  </div>
  <div class="share-button share-sms">
    <img src="sms.png" alt="" />
  </div>
</div>

CSS（Sass）：

.share-buttons {
  position: relative;
    display: flex;

  .share-button-main {
    width: 46px;
    height: 46px;
    z-index: 2;
    cursor: pointer;
    content: url('share-menu-share-closed.png')
  }

  .share-button {
    position: absolute;
    top: 0;
    left: 0;
    width: 46px;
    height: 46px;
    z-index: …

我正在尝试解决IE11中的一个很小的布局问题，其中滑块的点跳出了它的位置（在其他主要浏览器中都很好）

我已经向样式表添加了媒体查询（如下），但是没有运气。我也尝试过条件代码，各种破解等。但是没有任何效果或影响所有浏览器。我已经花了几个小时尝试各种解决方案，但运气不佳，想法也用光了。请需要帮助。说明了布局问题

  @media screen and (-ms-high-contrast: active),
  (-ms-high-contrast: none) {
    #yardstick-text-6-1 {
      margin-top: -43px;
    }
    #yardstick6-1 {
      margin-top: -53px;
    }
  }

该网页可以在此处看到，密码为：quote321

很难解释,但更容易通过JSFiddle显示

我有table3个细胞:

  <table class="table">
    <tr>
      <td style="background:blue;width:60%;">Some text for 1st cell</td>
      <td style="width:40%;background:red;"></td>
    </tr>
    <tr>
      <td colspan="2" style="width:100%;background:yellow;"><div style="width:400px;">
      test
      </div></td>
    </tr>
  </table>

在table拥有width的100%:

.table {
  width:100%;
}

当具有已定义的子元素width放置在具有a的底部单元格内时colspan,Microsoft Edge将显示width顶部单元格的不正确s.

他们应该这样显示:

不幸的是,微软边缘显示如下:

删除子元素(或它width),一切都很好.

我该如何解决这个问题？我需要将table宽度保持为百分比,将子元素保持为固定width.

我正在尝试使用velocity和calc()函数为元素的宽度设置动画.

$("#menuContainer").velocity({width: "calc(100% + -260px)"}, 500);

这会将元素的宽度设置为0.

难道.velocity不支持CSS函数计算() ？或者我是否忽略了基本的语法错误？