2017-04-14 105 views
1

我們如何從css更改google廣告信息按鈕的背景顏色。我們已經定製了廣告,但我們無法更改Google廣告信息按鈕的背景顏色。我已經看到一些原生廣告已經改變了顏色,即使你刪除了添加它不會去任何地方的代碼的每一部分,我怎麼能改變它的背景顏色?我加入的CSS代碼和圖片admobCssAdmob原生廣告CSS Google信息按鈕背景顏色

/* Note: 1px = 1dp in this css */ 

/* == Colors == */ 
body { 
    background-color: #ffffff; 
} 
.title-link { 
    color: #000000; 
} 
.button { 
    background-color: #9D0000; 
} 
.button-text, 
.button-link { 
    color: #FFFFFF; 
} 
.price, 
.reviews { 
    color: rgba(0,0,0,0.5); 
} 
.reviews svg { 
    fill: rgba(0,0,0,0.7); 
} 
.url-link { 
    color: rgba(0,0,0,0.3); 
} 
.body { 
    color: rgba(0,0,0,0.7); 
} 

/* == Fonts == */ 
body { 
    font-family: "Lobster"; 
    font-weight: normal; 
    font-size: 10px; 
} 
@media (min-height: 300px) { 
    body { 
    font-size: 11px; 
    } 
} 
@media (min-width: 360px) and (min-height: 300px) { 
    body { 
    font-size: 12px; 
    } 
} 
@media (min-width: 700px) and (min-height: 300px) { 
    body { 
    font-size: 16px; 
    } 
} 
.title { 
    font-size: 1.1em; 
    line-height: 1.2em; 
} 
.button { 
    font-size: 1.1em; 
} 
.body, 
.price, 
.reviews, 
.url { 
    font-size: 1em; 
    line-height: 1.1em; 
} 
@media (min-width: 360px) and (min-height: 300px) { 
    .title { 
    font-size: 1.2em; 
    line-height: 1.25em; 
    } 
    .button { 
    font-size: 1.2em; 
    } 
} 
@media (min-width: 700px) and (min-height: 300px) { 
    .title { 
    font-size: 1.3em; 
    line-height: 1.35em; 
    } 
    .button { 
    font-size: 1.3em; 
    } 
} 

/* == Layout == */ 
.title { 
    margin-bottom: 5px; 
    padding: 5px 0 0 8px; 
} 
.body { 
    margin: 2px 8px; 
} 
.button { 
    position: absolute; 
    bottom: 8px; 
    left: 8px; 
} 
/* == App install and video ad layouts == */ 
.app-icon { 
    float: left; 
    margin: 0 8px 4px 8px; 
    padding: 0; 
} 
.image-gallery, 
.video { 
    margin: 0 auto 8px auto; 
} 
/* == Content ad layout == */ 
.image { 
    margin: 0 auto 4px auto; 
} 

/* == Body == */ 
.body { 
    /* add more customizations here */ 
} 

/* == App icon == */ 
.app-icon img { 
    height: 50px; 
    width: 50px; 
    border-radius: 20%; 
} 
@media (min-width: 360px) and (min-height: 300px) { 
    .app-icon img { 
    height: 70px; 
    width: 70px; 
    } 
} 

/* == Title == */ 
.title { 
    display: block; 
    text-align: left; 
} 

/* == Button == */ 
.button { 
    border: none; 
    border-radius: 20px; 
    box-shadow: 0 0 2px rgba(0,0,0,0.12), 0 2px 2px rgba(0,0,0,0.24); 
} 
.button-link { 
    display: block; 
    position: relative; 
    padding: 0 1em; 
} 
.button svg { 
    display: none; 
} 
.button { 
    width: 90%; 
    width: calc(100% - 16px); 
    height: 2.8em; 
} 
.button-text { 
    display: block; 
    line-height: 2.8em; 
    text-align: center; 
} 
@media (min-width: 700px) and (min-height: 300px) { 
    .button { 
    height: 2em; 
    } 
    .button-text { 
    line-height: 2em; 
    } 
} 

/** 
* == Large image and video == 
* App install: 
* Use .image-gallery selector 
* Content: 
* Use .image selector 
* Video: 
* Use .video selector 
*/ 
.image-link, 
.image img { 
    width: 100%; 
    height: 100%; 
} 
.image-gallery a, 
.image a { 
    display: block; 
    line-height: 0; 
} 
.image-gallery, 
.video, 
.image { 
    width: 90%; 
    width: calc(100% - 16px); 
} 
.image-gallery, 
.video { 
    height: 50%; 
    height: calc(100% - 11em); 
} 
.image { 
    height: 50%; 
    height: calc(100% - 10em); 
} 
@media (min-width: 700px) and (min-height: 300px) { 
    .image-gallery, 
    .video { 
    height: calc(100% - 8.5em); 
    } 
    .image { 
    height: calc(100% - 8em); 
    } 
} 

/* == Attribution == */ 
.attribution { 
    background-color: #ffffff; 
    border-radius: 2px; 
    color: #aeaeae; 
    display: table; 
    font-size: 10px; 
    line-height: 13px; 
    margin: 4px 8px; 
    padding: 0 3px; 
    position: absolute; 
    top: 0; 
    left: 0; 
} 
.rtl .attribution { 
    background-color: #ffffff; 
    left: auto; 
    right: 0; 
} 

/* == Other == */ 
.ads a { 
    text-decoration: none; 
} 
.ads, .ad { 
    /** 
    * DO NOT TOUCH OR REMOVE 
    * Will break image rendering 
    */ 
    height: 100%; 
    width: 100%; 
    padding: 0; 
    word-wrap: break-word; 
} 
.ad { 
    /* Padding for attribution */ 
    padding-top: 23px; 
    height: calc(100% - 23px); 
} 

@DanielStorm發現如何改變它,但現在AdMob不允許它 admob does not allow

+0

這是來自AdMob的CSS。 com在創建廣告時是否正確? –

+0

是的,廣告羣體原生廣告 – BaranBerk

回答

0

我不是很熟悉CSS,但你可以檢查元素並查看ID爲abgbg,默認情況下其顏色設置爲#cdcccc。我在截圖中將其更改爲橙色(#FFA500)。我不確定如何在CSS中表達這一點,或者甚至可能,但這應該指向正確的方向。

enter image description here


編輯:

玩弄它的miniute後,你可以改變背景顏色,像這樣:

.abgbg { 
    fill: #FFFFFF !important; 
} 
+0

親愛的丹尼爾你是對的,但adMob不允許我做出這樣的改變。它說:您的本地廣告單元有1個廣告素材樣式錯誤。在保存廣告單元之前,您必須糾正這些錯誤並重新驗證廣告單元。瞭解詳情 對於多種廣告類型\t 「.abgbg」無法使用 – BaranBerk

+0

我無法在添加時驗證樣式 .abgbg fill:#FFFFFF!important; } – BaranBerk

+0

@BaranBerk我現在看到了。我沒有嘗試保存廣告單元。那麼我認爲這是不可能的。您可以添加一個廣告示例的圖片,並將其應用於您的問題?也許他們正在以不同的方式解決這個問題。 –