仕事中暇だったので、CSS3のテキストエフェクトまとめを作りました。
コピペで使える・・・はず。
【CSS3】コピペ用テキストエフェクト - jsdo.it - share JavaScript, HTML5 and CSS
コピペで使える・・・はず。
【CSS3】コピペ用テキストエフェクト - jsdo.it - share JavaScript, HTML5 and CSS
社内ニートがつらすぎて、最近仕事中にjs勉強してるitukiですw
↑これ結構わかりやすくていいです。基本から学びたいって人にはお勧め!
で、ここからが本題ですが、やる気にみせかけてみるでDISQUS試してみました。
中身はWordPressなので、そちらのコメントが既に書かれているため併用ができないのかちょっとアイコンの挙動がおかしい・・・もともと設定してあるWordPressのアイコンがきかないよーです・・・
ごそごそいじってるんですが、そこだけ直りません。
あとCSSちょっといじったらなんとか見れる感じです。

それにしてもオープンIDでログインできるって楽でいいですよねー(´∀`)
忘れ去られるアカパス増えなくていいしw
![]() | ゼロからわかる JavaScript超入門 (2010/01/08) 河西 朝雄 商品詳細を見る |
↑これ結構わかりやすくていいです。基本から学びたいって人にはお勧め!
で、ここからが本題ですが、やる気にみせかけてみるでDISQUS試してみました。
中身はWordPressなので、そちらのコメントが既に書かれているため併用ができないのかちょっとアイコンの挙動がおかしい・・・もともと設定してあるWordPressのアイコンがきかないよーです・・・
ごそごそいじってるんですが、そこだけ直りません。
あとCSSちょっといじったらなんとか見れる感じです。

それにしてもオープンIDでログインできるって楽でいいですよねー(´∀`)
忘れ去られるアカパス増えなくていいしw
*写真
ぱくたそ:ロゴのキャラがかわいい。作者さんがノイズとかも調整してくれてるので、いいかんじ。
modelpiece:サイトが結構好み。女性モデルが多め。
足成:小物探すなら大抵ここ。
*ベクター
シルエットデザイン:これはマジで重宝するので、ブクマ必須だと思う。ほれました←おい
花や植物系の素材サイト「Flode」:シルエットデザインと同じ作者さんのとこ。
*フレーム
フレームデザイン:シルエットデザインと同じ作者さんのとこ。
*いろいろ
フリーWEB素材サイト「DOTS DESIGN(ドッツ・デザイン)」:シルエットデザインと同じ作者さんのとこ。
0円の無料素材屋さん:ここのサイトも好み。アイコンとかいろいろある。
ぱくたそ:ロゴのキャラがかわいい。作者さんがノイズとかも調整してくれてるので、いいかんじ。
modelpiece:サイトが結構好み。女性モデルが多め。
足成:小物探すなら大抵ここ。
*ベクター
シルエットデザイン:これはマジで重宝するので、ブクマ必須だと思う。ほれました←おい
花や植物系の素材サイト「Flode」:シルエットデザインと同じ作者さんのとこ。
*フレーム
フレームデザイン:シルエットデザインと同じ作者さんのとこ。
*いろいろ
フリーWEB素材サイト「DOTS DESIGN(ドッツ・デザイン)」:シルエットデザインと同じ作者さんのとこ。
0円の無料素材屋さん:ここのサイトも好み。アイコンとかいろいろある。
ブログを放置するのもどうかなーと思えてきたので、今気になってるものでもちょこちょこ書いていこうかと。
*透過
RGB指定していたところ(#aabbcc)をrgba(aa,bb,cc,dd)で書く。
ddが0の場合透明で、1.0の場合不透明。
*均等割付(雑誌みたいに文字の右端をそろえる。やっぱりこっちの方がきれい)
text-justify: inter-ideograph;
text-align: justfy;
*リンク内で同じ高さにする(リストメニューの数字と文章をきれいに並べるとか)
li a { display: block;}
li a span { display: table-cell;}
*行数が違っても高さは同じのボックス内で上下左右センタリングする(メニューとかに使える)
display: -webkit-box;
-webkit-box-align: center; //縦方向の揃え位置
-webkit-box-pack: center; //横方向の揃え位置
*グラデ
コリス[CSS]CSS3グラデーションの表示サンプルと指定方法のまとめ
簡単にグラデCSSを生成するツールがかなりできましたが、Photoshopの.grdを読んだらその通りにCSSを作るツールができたらPhotoshopデザイン派はかなり楽になるのになぁと思うです。
javascriptとかできたら作れるんでしょうか
*丸角
CSS LectureCSS3 角丸を表現する border-radius
写真を丸角&ボックスシャドウにするときはいろいろ不具合があるのでご注意を。
コリス[CSS]画像に美しい角丸とボックスシャドウを適用する方法
*シャドウ
CSSドロップシャドウで紙の様なリアルな質感を出すテクニック集
kachibito.netCSS3のtext-shadowを使ったテキスト装飾のサンプル集
もう一個くらいこれは!と思ったやつがあったはずなのに、どこだったやら・・・
*雑誌みたいに先頭文字を大きくする
CSSでドロップキャップ:CSS 3分コーディング
*一文字下げる
一行目を1文字下げる
CSSで二行目以降を1字下げる
*気になったいろいろ
コリス[CSS]画像に美しい角丸やボックスシャドウ、グラデーション、アニメーションを適用する方法と注意点
一夜漬けでCSS3をマスターするために見ておくべきコードのまとめ
*透過
RGB指定していたところ(#aabbcc)をrgba(aa,bb,cc,dd)で書く。
ddが0の場合透明で、1.0の場合不透明。
*均等割付(雑誌みたいに文字の右端をそろえる。やっぱりこっちの方がきれい)
text-justify: inter-ideograph;
text-align: justfy;
*リンク内で同じ高さにする(リストメニューの数字と文章をきれいに並べるとか)
li a { display: block;}
li a span { display: table-cell;}
*行数が違っても高さは同じのボックス内で上下左右センタリングする(メニューとかに使える)
display: -webkit-box;
-webkit-box-align: center; //縦方向の揃え位置
-webkit-box-pack: center; //横方向の揃え位置
*グラデ
コリス[CSS]CSS3グラデーションの表示サンプルと指定方法のまとめ
簡単にグラデCSSを生成するツールがかなりできましたが、Photoshopの.grdを読んだらその通りにCSSを作るツールができたらPhotoshopデザイン派はかなり楽になるのになぁと思うです。
javascriptとかできたら作れるんでしょうか
*丸角
CSS LectureCSS3 角丸を表現する border-radius
写真を丸角&ボックスシャドウにするときはいろいろ不具合があるのでご注意を。
コリス[CSS]画像に美しい角丸とボックスシャドウを適用する方法
*シャドウ
CSSドロップシャドウで紙の様なリアルな質感を出すテクニック集
kachibito.netCSS3のtext-shadowを使ったテキスト装飾のサンプル集
もう一個くらいこれは!と思ったやつがあったはずなのに、どこだったやら・・・
*雑誌みたいに先頭文字を大きくする
CSSでドロップキャップ:CSS 3分コーディング
*一文字下げる
一行目を1文字下げる
CSSで二行目以降を1字下げる
*気になったいろいろ
コリス[CSS]画像に美しい角丸やボックスシャドウ、グラデーション、アニメーションを適用する方法と注意点
一夜漬けでCSS3をマスターするために見ておくべきコードのまとめ


