Personal tools
You are here: Home Plone Visual Ploneに新しいルックスを ヘッドラインとパラグラフスタイル

ヘッドラインとパラグラフスタイル

ヘッドラインとパラグラフにスタイルを追加する

ここではもうすこし基本的なものを追加していきましょう。ヘッドラインとパラグラフは、モックアップにマッチさせるのにスタイルを追加していく必要があります。またいくつかのブラウザのために画像のボーダを削除する必要があります。以下のコードをCSSに追加してください。

/* Headlines & other basics */
h1 {
    font-weight: normal;
    border-left: 4px solid #ec001a;
    padding: 0 5px;
}

p {
    padding-left: 9px;
    line-height: 1.5em;
}

a {
    color: #463229;
}

p a:link {
    color: #463229;
    text-decoration: none;
    border-bottom: 1px solid #463229;
}

img {
    border: none;
}

input {
    border: 1px solid #463229;
}

ここで注意しなければならないのは、aタグそのものではなく、a:linkという要素にスタイルを加えていると言うことです。これはHTMLアンカーにリンクスタイルを適用しないようにするためのものです。保存してリロードすれば、次のように見えるはずです。

ヘッドラインとパラグラフにスタイルを適用

Document Actions