2014　121１　　　2017　0829更新
シリウス画像編集カスタマイズテーマ　画像背景の透明化

 

 

画像の一部や人物回り...ロゴ周りを透明化するとヘッダー画像等々..
どこかで面白く使えるのではと記事を追記しております。

 

ヘッダーにこだわる解説になりますがスタイルシートでもヘッダー画像を
透明化することは出来るのですね

 

そんなスタイルが合うサイトではそれで良いのですが、記事内に

 

一部画像を表示させたい場合もありますね

 

 

当サイトではヘッダーを全て透明にするとどうにも背景と合わずバランス崩れ

 

で...現在7割ほどの部分を透明化している状態です

 

以下画像をご覧ください

 

画像は右端にあるように見えますが　記事幅５７０ＰＸの画像はあるのです

 

しかし...左の7割は透明となっております
マウスクリックするとご理解できます

 

記事内に導入する画像の半透明化もできます

 

ここでご注意..
この仕様は、背景が白ではあまり効果なし...以外で有効.

 

 

このスタイルの画像は無償のソフトみたいなもの

 

高機能という訳ではなさそうですが多くを求めない透明化コンテンツなら

 

初心者でも簡単に編集が可能です

 

操作解説は,
サイト内でご案内されておりますので省きます

 

こちらでご確認ください
半透明ＰＮＧさんのサイトです
http://www.officedaytime.com/toumei/

 

 

 

更なるご注意ごとがございました

 

シリウスの記事内では通常に透明度合いが確認できます

 

ですが...
ヘッダー画像として作成しシリウスのヘッダー画像設定で導入した場合

 

なぜか？

 

透明部分が黒くなってしまいます

 

 

対処法がございます
スタイルシートの以下記述

 

ヘッダー画像をシリウス内から読み込む記述

 

background-image: url(img/header.jpg);

 

header.jpg
の記述を　　例　1aaggxxx.pngと変えればよいのです

 

記述を変えたことで呼び込む場所がシリウス画像管理画面に
変更したことになります

 

画像コードをシリウスに読み込ませるには

 

一度、パソコン画像をシリウス画像呼び出して　
画像管理画面に記憶させてください

 

この方法はスタイルシートから画像読み込み指定をするので
以降全てのページで同じヘッダー画像が表示されます

 

といことは、個別ページごとに画像を変えられないということになる...

 

個別表示にする対応策は、class指定するしかございません…

 

スポンサーリンク

 

 

画像背景を透明化できる編集プログラム
画像編集ソフト　いいものまとめ
シリウスカスタマイズトップ