【问题标题】:HTML/CSS labels: Labels taking on the properties of other labelsHTML/CSS 标签:具有其他标签属性的标签
【发布时间】:2015-04-02 06:58:58
【问题描述】:

我很好奇是否有一种简单的方法可以让标签采用 CSS 样式属性的默认值。我的复选框正在使用我的选项卡的属性,我只是希望它们成为默认值。如您所见,我更改了复选框的字体大小,使其小于选项卡。但是,我不想编写 CSS 只是为了取消选项卡的样式。我知道我缺少一些东西。谢谢。

标签的 CSS:

           .tabs label {
            box-shadow: 0px 4px 10px #888888;
            display: block;
            padding: 10px 20px;
            border-radius: 2px 2px 0 0;
            color: #207cca;
            font-size: 20px;
            font-weight: normal;
            font-family: Impact, Verdana, sans-serif;
            background: rgba(255,255,255,0.2);
            cursor: pointer;
            position: relative;
            -webkit-transition: all 0.5s ease-in-out;
            -moz-transition: all 0.5s ease-in-out;
            -o-transition: all 0.5s ease-in-out;
            transition: all 0.5s ease-in-out;
        }

复选框的 CSS:

            #sidebar label {
            font-size: 10px;

        }

HTML 标签:

    <ul class="tabs">
         <li>
            <input type="radio" checked name="tabs" id="tab1">
            <label for="tab1">Resource Browser</label>
            <div id="tab-content1" class="tab-content animated fadeIn">

HTML 复选框:

    <div id="sidebar" class="sidebar">
                <form action="/result/" method="get">
                    <p> Demographics </p>
                    <input type="checkbox" name="male" value="selected" id="g_male" />
                    <label for="g_male">male</label><br>
                    <input type="checkbox" name="female" value="selected" id="g_female" />
                    <label for="g_female">female</label><br>
                    <input type="checkbox" name="age1-3" value="selected" id="age1-3" />
                    <label for="age1-3">Age 1-3</label><br>
                    <input type="checkbox" name="age3-18" value="selected" id="age3-18" />
                    <label for="age3-18">Age 3-18</label><br>
                    <input type="checkbox" name="age18+" value="selected" id="age18+" />
                    <label for="age18+">Age 18+</label><br>

【问题讨论】:

    标签: html css checkbox tabs


    【解决方案1】:

    您可以通过以下方式直接定位标签:

    .tabs > li > label {
        /* CSS here... */
    }
    

    #sidebar > form > label { 
        /* CSS here... */ 
    }
    

    【讨论】:

    • 谢谢!我会试一试,然后回复你。
    猜你喜欢
    • 2013-01-23
    • 2017-09-20
    • 1970-01-01
    • 1970-01-01
    • 2011-12-02
    • 1970-01-01
    • 1970-01-01
    • 2011-02-09
    • 2012-11-20
    相关资源
    最近更新 更多