小编Inf*_*tre的帖子

input.submit上的伪元素

我已经非常密切地关注了一些用伪元素制作小三角形的技术.

我成功地将这些应用于标题(和链接 - 在这里查看; http://culturecuts.co.uk),但当我尝试对注册表单执行相同操作时,我无法渲染三角形?

在同一链接的底部,您将看到我的注册表单,并且没有三角形!几个小时以来我一直在挠头!

HTML看起来像这样:

<p>Name <span class="wpcf7-form-control-wrap your-name"><input type="text" name="your-name" value="" class="wpcf7-text wpcf7-validates-as-required name" size="10" /></span> Email <span class="wpcf7-form-control-wrap your-email"><input type="text" name="your-email" value="" class="wpcf7-text wpcf7-validates-as-email wpcf7-validates-as-required email" size="10" /></span> <input type="submit" value="Subscribe" class="wpcf7-submit submit" />
Run Code Online (Sandbox Code Playgroud)

像这样的CSS:

    #wpcf7-f1967-t1-o1 {
    position: relative;
    display: block;
    background: #FFF;
    padding: 0 0 0 4px;
    line-height: 31px;      
    }
    #wpcf7-f1967-t1-o1 p {
        margin: 0;
        line-height: 31px;
        position: relative;
        }
    .wpcf7-submit.submit {
        float: right;
        position: relative;
        font-size: 10pt;
        padding: 0 10px;
        background: #1C5357;
        color: …
Run Code Online (Sandbox Code Playgroud)

html css input pseudo-element

3
推荐指数
1
解决办法
1万
查看次数

标签 统计

css ×1

html ×1

input ×1

pseudo-element ×1