タグ

ブックマーク / css-happylife.com (1)

  • 文章構造を崩さず出来るだけキレイに角丸をつくってみる。

    前回のエントリーでご紹介した角丸。 今回は、文章構造を維持出来るデザインが上がってきた場合の角丸の作成をしてみました。 仕様 タイトル:3行~4行くらいまで。 文:文字数・サイズ制限無し、横幅固定。 投稿日部分:3行~4行くらいまで。 サンプル:http://css-happylife.com/template/06/ ダウンロード:http://css-happylife.com/template/06/06.zip 使ってる画像。 角丸上部画像 繰り返し用画像 角丸下部画像 文字サイズなどを制限無しに対応する場合、上部画像、繰り返し用の画像、下部画像の3つが必要になってきます。 そうすると、必然的にdivが増えたりしてしまうんですが、サンプルのように、タイトル、文、投稿時間と分かれていれば、ソコにスタイルを適用させる事が出来るので非常にシンプルなHTMLで角丸が実現できます。 サン

    文章構造を崩さず出来るだけキレイに角丸をつくってみる。
  • 1