うまい具合にイスの背もたれで心地よく掻いています下山です。(傍から見るとモゾモゾ気持ち悪いオッサン・・・)さて上の画像をご覧ください。あ、もちろんCSS3使います。以前IEで独自拡張されていたtext-overflowプロパティがCSS3で採用されていました。(IE6以上OKです。)text-overflowプロパティとはテキストが表示領域からはみ出る場合の表示方法を指定するプロパティです。値はclip(表示できるところまで表示する)とellipsis(表示できるテキストの後に3点リーダー(省略記号)を表示する)の2種類。※表示できる領域とは幅(width)に依存します。使い方によってはブロックの高さを揃えたいときに活躍できるプロパティです。勝手に決めつけてます。マクロレンズで花を撮影するとこんな感じの写真になります。ファインダーを覗くと、そこは小人の世界。いいえちっちゃいオッサンの世界です。これはサボテンの花です。サボテンは話しかけるとよく育つとか言いますけど、それって病気です。サボテンなんかに話しかけてるところを彼女にでも見られようものならきっと・・・。これはサボテンの花です。alt=""><br>マクロレンズで撮影<br>マクロレンズで花を撮影するとこんな感じの写真になります。ファインダーを覗くと、そこは小人の世界。いいえちっちゃいオッサンの世界です。alt=""><br>これはサボテンの花です。<br>サボテンは話しかけるとよく育つとか言いますけど、それって病気です。サボテンなんかに話しかけてるところを彼女にでも見られようものならきっと・・・。これはサボテンの花です。#ccc;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;-o-text-overflow:ellipsis;}と、こんか感じです。ちなみにブロックの数が増えてもheight:310px;が効いてるのでレイアウトを崩すこと無くキレイにまとまります。(ドヤッ注意)改行を堺に1行づつtext-overflowしていくので、改行を含め複数行のテキストだと毎行「...」が付いてしまいます。追記:text-overflowプロパティはopera9、10のみプレフィックスが必要です。背景画像を画面いっぱいに表示するよ!しかもjqueryでIE7、IE8も対応だよ!背景画像を画面いっぱいに広げるってーのはー男のマロン。栗は美味しいね下山です。前に「ディスプレイサイズが変わっても背景画像を画面い...記事を読む[CSS3]いいかげんlinear-gradientとradial-gradientおぼえてグラデーションな四角でも書いてみようぜ。更新してないのに毎日一定のpvがあるのはボクの人徳だと自負しております下山ですどーもー。グラデーションて面倒くさいですよねー。...記事を読む[CSS]liをfloatして横に並べてそれを中央配置にするオレ的まとめもうタイトルが何言ってるか分からないですが読んだ通りですはい。いや、説明するとliをfloat:leftすると左揃えになってしまうも...記事を読む[CSS]text-shadowをIEでもやってみる。お久しぶりの更新で申し訳ないなんて微塵も思いません。全国2人(2人もいるのか知らんけど)の下山ファンの皆様、お待たせしました。Part.2前回の続きです。Flexboxの色々なプロパティを見ていきましょう。Font]Webフォントを使って洒落たメニューをおっさんが作ってみる。WebFontって使ったことないなー。アイコン的に使ってみた。洒落たメニュー作ってみたよ。今回使ったのは「Fo...記事を読む[CSS]:after擬似要素を使ってCSSだけで吹き出しを作る吹き出しといえば「笑う」みたいな変な固定観念を持ちあわせています下山です。今回は笑いながら記事を書きます。Compass]WindowsでSassとCompassで環境作るときにあったエラーのメモやっとおじさんも時代のニューウェーブに乗るためにSass環境を整えてみました。環境を作るのは黒い画面を使いますけど難しくないですねー。