• MENU●●●●
  • ユーザー定義ボックスカスタマイズ


    シリウスカスタマイズ アコーディオンブラインドメニューシリウスへ取り付け完了 詳細は外部カスタマイズメニューでご覧ください

    スポンサー広告

    関連記事


    ユーザー定義ボックスをナイスにカスタマイズ

    ユーザー定義ボックスでは好みのカラーを選択して 綺麗なカラー背景の
    ボックス枠を表現できます

     

    ここでは その表現する変化を二つ変えたカスタマイズをご案内します

     

    一つは 背景を透過して枠線だけ表示させるというもので
    好みのカラー枠内でコンテンツを表現できます

     

    背景などいらんから綺麗な枠線で記事を囲みたい方にはお勧めです

     

     

     

    背景をフィルター化して50%程 透過させる表し方
    50%程途は 好みにより透過度は変えられます

     

    他ページでも外部よりのコードで同表現に類似したカスタム説明は
    ございますがやや違いはあります

     

    カスタマイズ手順

     

     

    参照のためボックスの変化をご覧ください

     

    デフォルト

    シリウス

     

     

    上記述

    <div style="border:solid 1px #FF0A0A;background-color:#0A15FF;color:#FFFFFF;font-size:15px;padding:10px;">
    シリウス

     

    <img src="<% pageDepth %>img/aitikennnn.jpg" style="width:200px;" alt="" />
    </div>

     

     

     

    背景を透過しました 枠だけ確認できますね

    シリウス

     

     

    ;background-color:#0A15FFのカラーコードを

     

    transparent

     

    に入れ替えますと 背景が透過し 綺麗な枠線が強調されます

     

    枠線は定義ボックス作成時に太線にもカスタムできますので
    好みで選んで下さい

     


     

    背景をフィルター化する

     

     

    デフォルト

    シリウス

     

     

    上記述

    <div style="border:solid 1px #FF0A0A;background-color:#0A15FF;color:#FFFFFF;font-size:15px;padding:10px;">
    シリウス

     

    <img src="<% pageDepth %>img/aitikennnn.jpg" style="width:200px;" alt="" />
    </div>

     

     

     

    変化後

    シリウス

     

     

     

    以下の赤印の間に

     

    filter:alpha(opacity=50)
    を追加します

     

    記述例
    <div style="filter:alpha(opacity=50)border:solid 1px #FF0A0A;background-color:#0A15FF;color:#FFFFFF;font-size:15px;padding:10px;">

     

     

    opacity=50の数値変更で透過度は変化します

     

    スポンサーリンク

     

     

     

    シリウス機能 カラーボックスを理解しましょう
    ユーザー定義ボックスカスタマイズ
    シリウスカスタマイズ

    ユーザー定義ボックスカスタマイズ関連解説
    ユーザー定義ボックス枠内背景50%透過方法
    ユーザー定義ボックス枠内背景画像を要素を50%透過して見るとまた意外なサイト認識ができますね 背景画像を透過する方法の説明です

       広告

    .













    お勧め目 抜粋






















































    shop

    特典付き広告..ポチする
    【上位版】次世代型サイト作成システム「SIRIUS」


    シリウスカスタマイズで気を付けること


    サイトにnorton|ノートンの安全評価を付ける


    カスタムに使える情報

    Webデザインで使えるWeb配色ツールまとめサイト