小编Chr*_*les的帖子

我有一些标签:

<ul id="tabs">
    <li><a href="#tab-allData">All data</a></li>
    <li><a href="#tab-someOtherData">Some other data</a></li>
    <li><a href="#tab-xyData">xyData</a></li>
</ul>

我想识别单击了哪个选项卡并tab-从中删除了前缀href.

我试过这个js函数:

$('#tabs').click(function (event) {        
    activeTab = $(this).attr('href').split('-')[1];        
    FurtherProcessing(activeTab);        
});

但是我收到以下错误:

TypeError:$(...).attr(...)未定义activeTab = $(this).attr('href').split(' - ')[1];

我试图在同一条线上对齐两个div.没有问题,但现在我正在寻找一个解决方案,在每个div上具有相同的高度,问题是第一个只包含一个图标,第二个包含可能比图标占用更多空间的文本.我正在寻找一个css属性而不是可以帮我做到这一点......

.zone-info {
    background-color: #e0f1f5;
    line-height: 1.363em;
    margin-bottom: 3px;
    padding: 5px 0;
}

.zi-icon {
    display: inline-block;
    float: left;
    text-align: center;
    vertical-align: center;
    height: 100%;
    width: 10%;
}

.zi-text {
    width: 90%;
    display: inline-block;
    float: left;
}

<div class="zi-icon zone-info">icone</div>
<div class="zi-text zone-info">Quis autem vel eum iure reprehenderit qui in ea voluptate velit esse quam nihil molestiae consequatur.<br>
    # Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit.<br>
    # Nemo enim ipsam voluptatem quia voluptas …

我有一些用于制作按钮的css代码.我正在使用伪元素来创建我的按钮图标,并从精灵表中加载我的按钮.在我的例子中,我有3个按钮,但有时我有更多.

如果你研究我的CSS你可以看到每个伪元素之间唯一变化的是精灵位置.所以很多代码都在重复.

无论如何我可以使用更少的代码,但做同样的事情？

.add_button,
.excel_button,
.history_button {
    color: #000;
    padding-right: 10px;
    padding-left: 10px;
    padding-top: 5px;
    padding-bottom: 2px;
    border-radius: 5px;
    border: 2px solid #009900;
    height: 25px;
    width: 165px;
    margin-bottom: 5px;
    cursor: pointer;
    font-weight: 500;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 16px;
    -webkit-user-select: none;  
    -moz-user-select: none;    
    -ms-user-select: none;      
    user-select: none;
     position: relative; 
}
.add_button::before {
    content: "";
    width: 25px;
    height: 25px;
    background: url("../../images/buttons/buttons_25x25.png") 0px 0px no-repeat;
    float: left; 
    margin: -1px 10px 0px 0;
}
.excel_button::before {
    content: "";
    width: 25px;
    height: 25px;
    background: …

我正在尝试创建一个表,其中每行具有固定的高度,但是当达到特定高度时,会出现滚动条.

该表的代码是:

<div style="postion: relative; left: 100px; height: 100px; width: 450px; overflow-y: auto">

    <table id="dataTable" style="position: absolute; left: 100px; height: 100px; width: 400px">
        <tr>
            <th>Data Source </th>
            <th>File Type </th>
            <th>FIles</th>
        </tr>
        <tr>
            <td>EDI DATA </td>
            <td>
                <select>
                    <option>ALL </option>
                    <option>CSV</option>
                    <option>xls </option>
                    <option>sap</option>
                </select>
            </td>
            <td>
                <ul>
                    <li>EDI_Aug.csv</li>
                    <li>EDI_Aug.xls </li>
                    <li>EDI_Aug.xls </li>
                </ul>
            </td>
        </tr>
        <tr>
            <td>RECEIPT DATA </td>
            <td>
                <select>
                    <option>CSV</option>
                    <option>xls </option>
                    <option>sap</option>
                </select>
            </td>
            <td>
                <ul>
                    <li>RECEIPT_Aug.csv</li>
                    <li>RECEIPT_Aug.xls </li>
                    <li>RECEIPT_Aug.xls </li>
                </ul>
            </td>
        </tr>
        <tr>
            <td>CARRIER …