タグ

ブックマーク / lopan.jp (4)

  • ごめんなさいね。 - Lopan.jp

    Webデザインとかサイト制作について、知ってる事知らない事を展開するサイト。

    ごめんなさいね。 - Lopan.jp
  • Lopan.jp

    Webデザインとかサイト制作について、知ってる事知らない事を展開するサイト。

    Lopan.jp
  • 透明ノイズと紙テクスチャ。

    ちょっとざらざらした質感とか、手触りを感じるテクスチャって、背景にさりげなく敷くだけで、ほんのり暖かみが出ていいですよね。このブログにも背景にうっすらノイズ画像を敷いてます。真っ白にするよりも何となく柔らかい感じになって好きなんです;)。 そんなざらざらノイズ画像を半透明にした「透明ノイズ」のつくり方についてまとめてみます:)。 透明ノイズ 「透明ノイズ」とは、ノイズ画像を半透明にしたPNG画像のこと。僕が勝手にそう呼んでるだけですけど。 Firefoxで、画像を右クリックして「画像だけを表示」を選んだ時に開くページの背景にも使われてました(※下図は2013年9月現在。今は透明じゃないノイズになってます)。 Firefoxの「画像だけを表示」 body要素のスタイルに、下記のように指定されてました(※下記ソースコードは2013年9月現在)。 body { background: #222

    透明ノイズと紙テクスチャ。
  • よこ並びのCSS

    スマホサイトが優勢な昨今、要素をよこ並びにする機会は減ってきているのかもしれないけれど、大きい画面で見るサイトでは、ナビゲーションやタブや、商品一覧など、よこ並びにレイアウトする機会はまだまだあるんじゃないでしょうか。そんな「よこ並びにするためのCSS」も、やり方はさまざま。お馴染みのやつから、新参者まで、順番に見ていくことにします:)。 よこ並び? そう、よこ並び。 例えばボタンを横一列に並べたり。商品の情報なんかだと、横に3つずつ並べて改行して、多段に並べる場合もありますね。偏(ひとえ)に「よこ並び」と言えど、CSSにはそのやり方がたくさんあるんです:o。 導入 この記事で紹介するよこ並びの方法は以下の通り。 CSS歴史的な背景から、最初はfloatプロパティを使った方法を紹介します。 float(フロート) 要素を左右へ寄せるためのプロパティ。 後続する文章(テキスト)などのインラ

    よこ並びのCSS
  • 1