Lightningの余白カスタマイズ

  • yutanishika

    (@yutanishika)


    9年、 2ヶ月前

    素人ですが、ウェブサイトを作ろうと思っています。

    「Lightning」テーマの余白カスタマイズについて教えてください。

    「Lightning」ですが、各文字間やメインコンテンツエリアと右カラムの間など、
    余白が多すぎるのですが、これを詰めたいと思っています。

    cssを修正するのかと思うのですが、どこを触れば良いのかわかりません。

    「Aの場所をBに変更せよ」という感じで教えていただければ助かります。

    どうぞよろしくお願いいたします。

    参考サイトです→http://demo-ja.lightning.vektor-inc.co.jp/

3件の返信を表示中 - 1 - 3件目 (全3件中)
  • Tsuyoshi.

    (@andante0727)

    9年、 2ヶ月前

    CSSは勉強していただくとして、ブラウザの開発者ツール（ Firefox だと右クリック -> 要素の調査 ）を使うとどこを修正するのかわかりやすいと思います。

    line-height、margin、paddingなどを探しましょう 慣れていくしかないです。
    開発者ツールで変更した内容は一時的なものなので、プレビューはできますが、最終的にはCSSファイルを編集する必要があります。

    該当ファイルは ～/themes/lightning/css/style.css になっていますが、テーマのアップデートを考慮して別のCSSを読み込んでスタイルを上書きするとか良いかも。（オリジナルCSSの読み込みは、JetPackプラグインを使えば簡単です）。

    トピック投稿者 yutanishika

    (@yutanishika)

    9年、 2ヶ月前

    tsuyoshiさんありがとうございます。

    お返事遅くなり申し訳ありません。

    まず勉強ですね。実地練習と思ってやってみます。

    開発者ツールを使っていろいろとやってみます。

    ありがとうございます。
    また教えて下さい。

    よろしくお願いします。

    천궁 메텔

    (@digitmaetel)

    9年、 2ヶ月前

    CSS の領域になるので、このフォーラムでは多くを語りませんが
    「カラム間の余白を詰めたい」ということで、頭の隅においておきたいことが有ります。

    ブラウザの違いで余白の解釈や、計算の順番を含めた計算方法が異なります。
    また、Windows と MacOSX ではフォントが異なるので、かえって見苦しくなっているサイトに良く出会います。

    CSSレイアウト崩れの原因 – ブラウザによる「padding」の解釈の違い

    古い記事ですが基本として抑えておきたいことが説明されています。

3件の返信を表示中 - 1 - 3件目 (全3件中)
  • トピック「Lightningの余白カスタマイズ」には新たに返信することはできません。