These lovely water-colorful dots will make your designs pop...
These lovely water-colorful dots will make your designs pop...
どーも。Macユーザーのはしくれです。普段何気なく使ってると、便利なのに案外気づかない機能がたくさんあったりもします。Macユーザーの知り合いなんかと話してて喜ばれたこと、また自分が知らなかったことなど、シェアしていきたいと思います。ヘヴィユーザーには当たり前のこともたくさんあるかも知れませんが、何かの参考になれば幸いです。 ちなみに、今回登場する画像の中で、愛らしいお菓子の画像は、フェイクスイーツと言って、粘土で作られたスイーツたちです。 全て、(Macユーザー仲間でもある)blingbling pumpkinsさんの作品で、今回写真掲載を許可していただきました!ありがとうございます。 3/31、4/1に開催される、日本かわいい博in新潟にも作品を展示されるそうですので、ひとつよしなにどうぞ。 command + deleteで行のカーソルより左側の文字が全部消える 見出しそのままですが
CSS3を使った画像のエフェクトやスタイリングについて、思いつく限り一挙にまとめてみました。 たくさん画像を扱うサイトなどを作る際に、CSSでできる表現のカタログとして使ってもらえたらと思います。 ※ 2/24 「2. めくれた風」を書き忘れていたので追記しました 目次 1. シャドウ 2. めくれた風 3. トイカメラ風トンネル効果 4. カラー調整 5. 回転 6. 角丸 7. 楕円のフレーム 8. 円のフレーム 9. 三角形フレーム 10. 重なった風 11. ぼかし 12. フェード(シャドウ編) 13. フェード(グラデーション編) 14. 反射 15. リボン 16. 差し込んだ風 17. フレームだけを傾ける 18. 半透明フレーム まとめ ※ 実際の表示はこちらから確認できます。 ※ この記事で掲載しているCSSは、シンプルにするためにベンダープリフィックスを付けていません
これで背景色が最大まで表示されます。 px指定は 「画像の横幅-10px」 です。 このサンプル画像は500pxですので、-10pxで490pxですね。 さっきの表示でいいって方は、このカスタマイズは忘れてOKです。 以上、「CSSで画像の中にキャプション(説明)を入れるサンプル」 でした。 今回は初級という事ですので割合しますが、このサンプルの内容をいじれば、表示する場所とかサイズとか、かなり色々と変える事が出来ます。 やってみたい方はご自由にいじってみて下さい。 * 追記 ご質問をいただいたので、背景を横全体に表示する場合で、画像サイズを複数指定する時の簡単なサンプルを追記しておきます。 CSS スタイルシート こんな感じでコーディングしておけば、様々なサイズの画像にも対応出来ますね。 HTML 上記のように、p タグにクラス指定してあげればOKです。
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く