我对 Pardot 布局 css 有一些问题。我试图自定义一个表单,我需要添加类来设计不同的字段。创建新类没有问题,代码如下所示:
form.form .ownclass{
margin-left:40px; !important;
}
form.form .ownclass label{
font-size: 14px; !important;
font-weight: bold !important;
}
我不知道这是否是最好的方法,但它正在工作。问题是,例如,我有一些单选按钮。我想更改标题的字体粗细,而不是单选按钮旁边文本的字体粗细。当我尝试上面的标签代码时,我总是更改标题和选项的文本。复选框也有同样的问题。知道如何将我的代码仅添加到标题或单选按钮选项吗?
谢谢你的帮助。
编辑:
有这个奇怪的 pardot hmtl 代码。这里是:
<form accept-charset="UTF-8" method="post" action="%%form-action-url%%" class="form" id="pardot-form">
%%form-opening-general-content%%
%%form-if-thank-you%%
%%form-javascript-focus%%
%%form-thank-you-content%%
%%form-thank-you-code%%
%%form-end-if-thank-you%%
%%form-if-display-form%%
%%form-before-form-content%%
%%form-if-error%%
<p class="errors">Please correct the errors below:</p>
%%form-end-if-error%%
<br/>
%%form-start-loop-fields%%
<section class="container">
<div class="row col-md-12 col-sm-12">
<p class="form-field %%form-field-css-classes%% %%form-field-class-type%% %%form-field-class-required%% %%form-field-class-hidden%% %%form-field-class-no-label%% %%form-field-class-error%% %%form-field-dependency-css%%" style="padding-left:-160px;">
%%form-if-field-label%%
<label class="field-label" for="%%form-field-id%%">%%form-field-label%%</label>
%%form-end-if-field-label%%
%%form-field-input%%
%%form-if-field-description%%
<span class="description">%%form-field-description%%</span>
%%form-end-if-field-description%%
</p>
<div id="error_for_%%form-field-id%%" style="display:none"></div>
%%form-field-if-error%%
<p class="error no-label">%%form-field-error-message%%</p>
%%form-field-end-if-error%%
</div></section>
%%form-end-loop-fields%%
%%form-spam-trap-field%%
<!-- forces IE5-8 to correctly submit UTF8 content -->
<input name="_utf8" type="hidden" value="☃" />
<section class="container">
<div class="row col-md-12 col-sm-12">
<br/>
<br/>
<p class="submit">
<input type="submit" accesskey="s" value="%%form-submit-button-text%%" %%form-submit-disabled%%/>
</p>
%%form-after-form-content%%
</div>
</section>
%%form-end-if-display-form%%
%%form-javascript-link-target-top%%
</form>
编辑2:这是复选框的html代码:
<section class="container">
<div class="row col-md-12 col-sm-12">
<p class="form-field ownclass Custom_5018_V_M_Alle pd-checkbox required required-custom " style="padding-left:-160px;">
<label class="field-label" for="310831_66701pi_310831_66701">Title of the checkbox *</label>
<span class="value"><span><input type="checkbox" name="310831_66701pi_310831_66701_526719" id="310831_66701pi_310831_66701_526719" value="526719" onchange="" /><label class="inline" for="310831_66701pi_310831_66701_526719">Option 1</label></span><span><input type="checkbox" name="310831_66701pi_310831_66701_526721" id="310831_66701pi_310831_66701_526721" value="526721" onchange="" /><label class="inline" for="310831_66701pi_310831_66701_526721">Option 2</label></span></span>
</p>
<div id="error_for_310831_66701pi_310831_66701" style="display:none"></div>
<section class="container">
<div class="row col-md-12 col-sm-12">
<p class="form-field ownclass Opt_in_Status pd-checkbox required required-custom " style="padding-left:-160px;">
<label class="field-label" for="310831_67219pi_310831_67219">Überschrift *</label>
<span class="value"><span><input type="checkbox" name="310831_67219pi_310831_67219_529439" id="310831_67219pi_310831_67219_529439" value="529439" onchange="" /><label class="inline" for="310831_67219pi_310831_67219_529439">Text for the checkbox</label></span></span>
</p>
<div id="error_for_310831_67219pi_310831_67219" style="display:none"></div>
这是单选按钮的html代码:
<section class="container">
<div class="row col-md-12 col-sm-12">
<p class="form-field salutation pd-radio required required-custom " style="padding-left:-160px;">
<label class="field-label" for="310831_66691pi_310831_66691">Title of the radio button *</label>
<span class="value"><span class="" style=""><input type="radio" name="310831_66691pi_310831_66691[]" id="310831_66691pi_310831_66691_526699_526699" value="526699" onchange="" /><label class="inline" for="310831_66691pi_310831_66691_526699_526699"> Frau</label></span><span class="" style=""><input type="radio" name="310831_66691pi_310831_66691[]" id="310831_66691pi_310831_66691_526701_526701" value="526701" onchange="" /><label class="inline" for="310831_66691pi_310831_66691_526701_526701"> Herr</label></span></span>
</p>
<div id="error_for_310831_66691pi_310831_66691" style="display:none"></div>