Question

我想使用CSS定位标签。怎么样？它是WordPress，是一种联系表单，我设法移动了所有其他部分，包括：textarea, submit, anr recaptcha，但没有移动文本标签。

label> Your Name (required)<br />
<span class="wpcf7-form-control-wrap your-name">. 
<input type="text" name="your-name" value="" size="40" 
class="wpcf7-form-control wpcf7-text wpcf7-validates. 
as-required" aria-required="true" aria-invalid="false" />. 
</span> </label></p>
<p><label> Your Email (required)<br />
<span class="wpcf7-form-control-wrap your-email">. 
<input 
type="email" name="your-email" value="" size="40"
class="wpcf7-form-control wpcf7-text

尝试：

@media (min-width: 768px) {label.wpcf7-form- 
control{margin-left: 15px;}}

并且：

@media (min-width: 768px) {p 
label.wpcf7-form- 
control{margin-left: 15px;}}

并且：

@media (min-width: 768px) 
{label.wpcf7-form- 
control>.wpcf7-text {margin-left: 
15px;}}

没用。

Page in question

Answer 1

示例代码中的label元素似乎没有与之关联的任何类。

您可以像这样简单地选择它：

@media (min-width: 768px) {
    label {
        margin-left: 15px;
    }
}

...虽然这可能不是一个好主意，因为它会影响页面上的所有<label>元素。

我会在联系表单窗口小部件中寻找任何包装器类，并对其进行安全范围划分。例如：

@media (min-width: 768px) {
    .wpcf7-form-wrap label {
        margin-left: 15px;
    }
}

PS。您所有的CSS示例都有错别字。您使用的是wpfc7而不是wpcf7。

使用CSS定位标签

1 个答案: