Jquery mobile如何删除ui-body类周围的边框

时间:2014-03-18 16:39:25

标签: javascript jquery html css jquery-mobile

是否可以从我的div中的类ui-body中删除边框?请忽略顶部的虚线边框,我必须删除它。我需要的是用类ui-body去除每个div周围的边框。非常感谢你。

截图:

ui_body_border

HTML:

    <div class="ui-body ui-body-c">
        {foreach from=$category_26 item=CAT}
        <h2 style="color: #236EE8;" class="main">
            <a style="color: #236EE8; text-decoration: underline;" href="/{$country}/{$lang}/26_{$CAT.friendlyTitle}.html">
                {$CAT.Title}
            </a> 
        </h2>
        {/foreach}
    </div>
        {php}
            $this->assign('MaxNo',3);
        {/php}
        {assign var=number value=0}
        {section name=ArtCat_26 loop=$ArtCat_26 max=$MaxNo}
            {if $number == 0 || $number == 2}
              <div class="ui-body ui-body-d">
                {foreach from=$category_26 item=CAT}
                <h4 style="color: #236EE8;">
                <a style="color: #236EE8; text-decoration: underline;" href="/{$country}/{$lang}/{$CAT.ID}_{$CAT.friendlyTitle}/{$ArtCat_26[ArtCat_26].ID}_{$ArtCat_26[ArtCat_26].friendlyTitle}.html?do=article">
                    <b>{$ArtCat_26[ArtCat_26].Title}</b>
                </a>
                </h4>
                <p class="news">
                <span class="small2">{$ArtCat_26[ArtCat_26].ShortText}
                 <a href="/{$country}/{$lang}/{$CAT.ID}_{$CAT.friendlyTitle}/{$ArtCat_26[ArtCat_26].ID}_{$ArtCat_26[ArtCat_26].friendlyTitle}.html?do=article"></a>
                 </span>
                </p>
                {/foreach}
              </div>
            {else}
              <div class="ui-body ui-body-c">
                {foreach from=$category_26 item=CAT}
                <h4 style="color: #236EE8;">
                <a style="color: #236EE8; text-decoration: underline;" href="/{$country}/{$lang}/{$CAT.ID}_{$CAT.friendlyTitle}/{$ArtCat_26[ArtCat_26].ID}_{$ArtCat_26[ArtCat_26].friendlyTitle}.html?do=article">
                    <b>{$ArtCat_26[ArtCat_26].Title}</b>
                </a>
                </h4>
                <p class="news">
                <span class="small2">{$ArtCat_26[ArtCat_26].ShortText}
                 <a href="/{$country}/{$lang}/{$CAT.ID}_{$CAT.friendlyTitle}/{$ArtCat_26[ArtCat_26].ID}_{$ArtCat_26[ArtCat_26].friendlyTitle}.html?do=article"></a>
                 </span>
                </p>
                {/foreach}
              </div>
            {/if}
            {assign var=number value=$number+1}
        {/section}

1 个答案:

答案 0 :(得分:0)

首先,您必须找到现在应用的样式规则。为此,找到css中最具体的规则,或者只是检查浏览器的开发人员栏中的元素。

然后一旦找到它,只需从那里删除样式。

如果由于某种原因无法编辑该文件,请在某处添加更具体的样式

如果currentstyle是

.ui-body{}

更具体的风格可以

div.ui-body{}

body .ui-body{}

所以这些更具体的样式将覆盖样式

只有边缘情况是使用!important或内联样式。

如果元素有一些内联样式应用了一些javascript,如

<div class="ui-body ui-body-c" style="border:1px solid red">

外部css中没有规则可以覆盖它,但是!important

如果您使用

.ui-body{
border:1px solid red !important;
}

这将覆盖所有样式,包括内联样式,这违反了javascript程序员的普遍看法,所以它总是安全不使用它,因为程序员通常认为内联样式可以覆盖所有css规则。

总是尝试使用一些更具体的样式规则,因为练习!important可能会让您在继续前进时难以调试问题。