如何使用CSS设定目标价值选项?

时间:2019-05-22 13:56:37

标签: html css wordpress

我正在寻找一种针对我的价值选择page 1 of X的方法。看来这被定义为值选项。我可以只将div类定位为将其稍微向下移动以与另一个元素对齐吗?

HTML:

<div class="pager">
<form class="awpcp-pagination-form" method="get">
    <table>
        <tbody>
            <tr>
                <td>1</td>
                <td>
                    <select name="results">                                                                         
                        <option value="5">5</option>                                                                                                          
                        <option value="10" selected="selected">10</option>                                                                                                          
                        <option value="20">20</option>                                                                                                   
                        <option value="30">30</option>                                                                                    
                        <option value="40">40</option>                                                                                                                       
                        <option value="50">50</option>                                                                                                                                      
                        <option value="60">60</option>                                                                                                
                        <option value="70">70</option>                                                                                             
                        <option value="80">80</option>                                                                                     
                        <option value="90">90</option>                                                    
                        <option value="100">100</option>                                                               
                        <option value="500">500</option>
                    </select>
                </td>
            </tr>
        </tbody>
    </table>
</form>

    

页面:https://adsler.co.uk/browse-adsler/

2 个答案:

答案 0 :(得分:0)

您的问题还不确定,但是假设您想要一种定位元素的方法,并且基于提供的HTML,这是定位特定HTML元素的方法。

/* Pagination container */
.awpcp-pagination-form {
  outline: 1px solid purple;
  padding: 10px;
}


/* Only the selection within container */
.awpcp-pagination-form select {
  outline: 1px solid blue;
}


/* or */

select[name="results"] {
  background: red;
}
<div class="pager">
  <form class="awpcp-pagination-form" method="get">
    <table>
      <tbody>
        <tr>
          <td>1</td>
          <td>
            <select name="results">
              <option value="5">5</option>
              <option value="10" selected="selected">10</option>
              <option value="20">20</option>
              <option value="30">30</option>
              <option value="40">40</option>
              <option value="50">50</option>
              <option value="60">60</option>
              <option value="70">70</option>
              <option value="80">80</option>
              <option value="90">90</option>
              <option value="100">100</option>
              <option value="500">500</option>
            </select>
          </td>
        </tr>
      </tbody>
    </table>
  </form>

答案 1 :(得分:0)

如果我理解您的问题,则可以使用css的边距来实现。

.divclass{ margin-top: 2%; }

类似的事情可能起作用。您也可以尝试使用Flex-Box或Grid。

祝你好运!