無法在Scss中設置佔位符文本的樣式

Question

我是SCSS的新手。我試圖將我的佔位符文本從淺灰色轉換爲深灰色。 附件是html代碼：

<div class="form-group"> 
    <textarea class="thread-textarea" ng-maxlength="255" maxlength="255" ng-model="newMessage.Content" ng-keyup="keycount($event)"placeholder="If this is an emergency, call 911. Otherwise, type your message here. We try to respond within 24 hours."title="Type your message" spellcheck="true" aria-labelledby="typeYourMessage"></textarea> 
    <span class="aria-hidden" id="typeYourMessage">Type your message</span> 
</div> 

附件是我的相關SCSS代碼。

$darkgrey: #333333; 
textarea{ 
    @include placeholder 
    { 
     color: $darkgrey; 
    } 
} 

我想將佔位符的顏色從灰色改爲深灰色。任何幫助將不勝感激。

Answer 1

/* cross browser way */ 
 

 
textarea::-webkit-input-placeholder { /* Chrome/Opera/Safari */ 
 
    color: pink; 
 
} 
 
textarea::-moz-placeholder { /* Firefox 19+ */ 
 
    color: pink; 
 
} 
 
textarea:-ms-input-placeholder { /* IE 10+ */ 
 
    color: pink; 
 
} 
 
textarea:-moz-placeholder { /* Firefox 18- */ 
 
    color: pink; 
 
} 
 

 
/* sass whould be like this */ 
 
/* 
 
$darkgrey: #333333; 
 
textarea{ 
 
    &::-webkit-input-placeholder { 
 
    color: $darkgrey; 
 
    } 
 
    &::-moz-placeholder { 
 
    color: $darkgrey; 
 
    } 
 
    &:-ms-input-placeholder { 
 
    color: $darkgrey; 
 
    } 
 
    &:-moz-placeholder { 
 
    color: $darkgrey; 
 
    } 
 
} 
 
*/

<div class="form-group"> 
 
    <textarea class="thread-textarea" ng-maxlength="255" maxlength="255" ng-model="newMessage.Content" ng-keyup="keycount($event)" placeholder="If this is an emergency, call 911. Otherwise, type your message here. We try to respond within 24 hours." title="Type your message" 
 
    spellcheck="true" aria-labelledby="typeYourMessage"></textarea> 
 
    <span class="aria-hidden" id="typeYourMessage">Type your message</span> 
 
</div>

就拿這並應用SASS的風格吧。