如何在使用中更改HTML中CSS事物的屬性？

-2

對不起，如果這個問題是不是真的有關，我是法國人，我不知道我所要求的正確條款:)如何在使用中更改HTML中CSS事物的屬性？

這是我創建的'東西'（模塊？）創建一個圈子。

.fake-avatar { 
    width: 70px; 
    height: 70px; 
    }

但我想簡要介紹一下這一塊，而無需創建這樣的：在這裏我用它

.fake-avatar-outline { 
    width: 72px; 
    height: 72px; 
    }

這裏是：

.fake-avatar-outline.rounded.flex-center.b-success.m-auto.bg-pink 
    .fake-avatar.rounded.flex-center.b-success.text-xl.m-auto.bg-pink-light.icon-star

因此我們的目標是隻假頭像和手動更改大小。這怎麼可能？我應該做這樣的事情：

.fake-avatar.rounded.flex-center.b-success.m-auto.bg-pink(width='72px') 
    .fake-avatar.rounded.flex-center.b-success.text-xl.m-auto.bg-pink-light.icon-star

謝謝

薩科

來源

2017-09-21 Nicolas Guerin

如果我理解這個正確的，你正在尋找一個邊界

.fake-avatar { 
    width: 70px; 
    height: 70px; 

    /* Add this*/ 
    border: 2px solid #FFF; /* color can go here */ 
    /* If you wanted a circle */ 
    border-radius: 50%; 
}

編輯：由於在規定評論，海報也在尋找一種方法來改變元素的寬度，而不必改變CSS文件中的類。我說他可以使用內聯樣式。

<div class="fake-avatar" style="width: 72px"></div>

我還注意到，這樣設置樣式通常是不被贊同的，因爲它使得css維護成爲一場噩夢。

來源

2017-09-21 23:40:07

您好，感謝的答案，但沒有我要找勾勒與其他顏色的不只是添加邊框圓。這裏是圈子，但我需要知道如何手動更改大小，以便像其他事情。謝謝您：D –

您可以通過輸入另一種顏色來更改邊框的顏色。在這種情況下，它的第三個參數被設置爲白色。 –

正如我所說，這不僅是關於這個圈子是爲了一個普遍的目的。我可以在html中使用它時手動更改大小嗎？ –

擴展@ DavidLee的回答，這裏有兩個選項運行代碼的代碼片段。

.fake-avatar { 
 
    width: 70px; 
 
    height: 70px; 
 
    border: 2px solid white; 
 
    border-radius: 50%; 
 
    background-color:blue; 
 
} 
 

 
.fake-avatar-outline { 
 
    width: 70px; 
 
    height: 70px; 
 
    border: 1px solid red; 
 
    border-radius: 50%; 
 
}

<div class="fake-avatar"></div> 
 

 
<div class="fake-avatar-outline"></div>

來源

2017-09-21 23:50:26 jfeferman

是的，我不滿意謝謝你的代碼。但我所說的是：是否有可能只用1個.fake-avatar做這兩個圈子？當我在HTML中調用寬度時將寬度更改爲72像素？ –

您可以使用javascript更改這些元素的樣式屬性以響應事件。 – jfeferman

如何在使用中更改HTML中CSS事物的屬性？

回答

相關問題