Arras 1.5.1.2: 修改幻燈片中的黑色區塊樣式

因為有網友在問如何修改幻燈片中那段黑色區塊的高度及透明度,所以就順便PO成文章做做筆記囉~

Arras 1.4的改法:

設定高度
首先開啟arras-theme/css/styles/default.css,在第154行會看到如下這串:

.featured-entry			{ position: relative; top: 165px; overflow: hidden; background: #000; height: 85px; color: #a7a7a7; padding: 0; display: block; opacity: 0.8; filter: alpha(opacity = 80); }

其中height: 85px;就是黑色區塊的高度值,但是你在這邊增減數值時也相對的要在top: 165px;減增回去,比如說我把height設為65px,則top就要設為165+20=185px

設定透明度
一樣也是在那一行中尋找opacity: 0.8; filter: alpha(opacity = 80);,因為為了相容瀏覽器可以顯示透明度所以會有兩種數值,一邊是用小數點另一邊是用整數,如果要改到不透明的話就是設 1 (100) 啦~~

 

Arras 1.5.1.2的改法:

設定高度
也是開啟arras/css/styles/default.css,在約第147行會看到如下這串:

.featured-entry			{ background: #000; height: 85px; color: #a7a7a7; }

此外也開啟arras/css/base.css,在約第105行會看到如下這串:

.featured-entry  { position: relative; top: -85px; overflow: hidden; padding: 0; display: block; opacity: 0.8; }

其中default.cssheight: 85px;就是黑色區塊的高度值,比如說我想要高度為65px則就改為height: 65px!important;,然後base.csstop: -85px;也要相對應其數值改為top: -65px!important;,這樣就可以成功把高度改為你想要的大小了。

設定透明度
一樣也是在base.css的那一行中尋找opacity: 0.8;,如果要改到不透明的話就是設 1 啦~~