如何將風格應用於所有課堂？

Question

我試圖在指定的類中應用樣式，即使它包含一些數值或字符串值的屬性，但樣式不適用，我不知道我在哪裏犯了一個錯誤，下面我已將我的代碼放置在您的親切的參考。

HTML

<p class="test">Some text contains....</p> 
<p class="test2">Some text contains....</p> 
<p class="test4">Some text contains....</p> 
<p class="testa">Some text contains....</p> 
<p class="test1">Some text contains....</p> 

的CSS：

p.test* 
{ 
color: blue; 
font-size:150%; 
} 

請告訴我如何解決這個問題？

謝謝。

Answer 1

使用在你的CSS：

p[class^="test"]{ 
color: blue; 
font-size:150%; 
} 

Answer 2

使用相同的類中的所有p元素

HTML

<p class="test">Some text contains....</p> 
<p class="test">Some text contains....</p> 
<p class="test">Some text contains....</p> 
<p class="test">Some text contains....</p> 
<p class="test">Some text contains....</p> 

CSS

.test { 
    color: blue; 
    font-size:150%; 
} 

Answer 3

試試這個方法

p[class^="test"]{ 
color: blue; 
font-size:150%; 
} 

演示鏈接https://jsfiddle.net/cne9gebf/

Answer 4

<p>red font color 1</p> 
<p>red font color 2</p> 
<p>red font color 3</p> 
<p>red font color 4</p> 
<p>red font color 5</p> 
<p>red font color 6</p> 

<style> 
p{ 
color:red; 
} 
</style> 

現在，這將工作簡單

Answer 5

這裏有一些鏈接，這應有助於你如何在各種情況下的應用CSS屬性選擇器（包括您在提問中提到的場景）

http://www.sitepoint.com/web-foundations/attribute-selector-css-selector/

http://www.sitepoint.com/web-foundations/css3-attribute-selectors/

即將到你的情況，如下它應該是簡單的：

p[class^="test"]{ 
color: blue; 
font-size:150%; 
} 

在這裏，你在做什麼，但應用的樣式誰滿足下列規則的所有p元素

1. 具有class屬性
2. class屬性的值從模式「test」開始。