*Essence

HP用フリー素材とFC2共有テンプレートを作成・配布しています。

TOP > 2018年07月

al_responsive のカスタマイズ(CSS変更・その他)

al_responsive のカスタマイズ(CSS変更・その他)

その他の箇所のカスタマイズ(^-^;です。暗色系・シンプル系等、全く異なったイメージを作る際に是非変更してみて下さい。1) 薄く透過されている大枠の背景 2) 丸みを帯びた角を直角に戻す。3) 記事掲載時にYouTube等の動画をレスポンシブで埋め込む1) 薄く透過されている大枠の背景 [al_responsive〇c]のスタイルシート編集枠をほんの少し下げた所に有る#wrapper{ という部分の背景色を変更します。何も加工が無け...

… 続きを読む

al_responsive のカスタマイズ(トップ画像変更)

al_responsive のカスタマイズ(トップ画像変更)

トップ画像の変更方法です。背景画像を横幅100%でレスポンシブ対応させる方法は幾つか有りますが、パーセント指定と 背景画像変更② でのbackground-size:contein; を使った方法です。background-size:cover; では、画像の幅と高さの比率を固定して領域を覆うように表示されますが、はみ出した部分は表示されません。background-size:contain; も画像の幅と高さの比率を固定しますが、表示領域が変更された場合でも画像が全て表示さ...

… 続きを読む

al_responsive のカスタマイズ(背景画像変更 ② )

al_responsive のカスタマイズ(背景画像変更 ② )

引き続き、背景画像の変更方法です。大きい画像を背景に、ディスプレイサイズに合わせて表示するようにします。←使用する画像はこちら。表示位置が分かり易いよう見本を表示するBoxに背景色(#e2eccb;)を付けています。 背景画像のサイズを調整するプロパティは、背景(background)に background-size: サイズの値; を使います。指定できる値は下記のとおりです。background-size:auto;background-size:auto;background-size :au...

… 続きを読む

al_responsive のカスタマイズ(背景画像変更 ① )

al_responsive のカスタマイズ(背景画像変更 ① )

今時とってもLegacyな テンプレートですが、その分『見掛け』を自分流にカスタマイズ出来るように、CSSも(多分)分かり易く作っております。可愛い愛犬・愛猫や、旅先で撮った素敵な画像等々…お好きなように飾って下さい。(^-^)...

… 続きを読む