Uni-Q blog

うにきゅう ぶろぐ

💻 CSS・HTML

css で ParrotアニGIF みたいなの

はじめに これは 第2のドワンゴ Advent Calendar 24日目の記事として書かれた記事です。 自己紹介 こんにちわ。元ドワンゴのデザイナー id:uniq です。 ドワンゴというと何故か ParrotアニGIF を思い出しました。 なので、なんとなくCSSでチカチカクルクルす…

BPStudy #88 で connpass のデザインについて話してきました

BPStudy #88 にて connpass の中のお話があり〜… connpass のスタッフみんなで順番に話したんですが、自分はデザインまわりのお話をしてきました。 connpass でのデザイナーの役割 CSS設計はデザインのためにもなるよね そんな内容です。 スライドはこちらで…

オブジェクト指向のCSSの話とか、smacssとbemの話とか

オブジェクト指向のCSSの話メインで、smacssとbemの紹介とか。 7月アタマの頃ですけど、社内勉強会にて、好き勝手にしゃべってみました。(;´∀`) Oocssとかついでにsmacssとbemの話も from Yumi uniq Hashizume smacssやbemは、いわゆるCSS設計のルールです…

CSS設計について上手に説明したいのでメモメモ

めもめも CSS設計ポイントは… ベース、レイアウト、モジュール、ステートで体系化。 測しやすい、再利用しやすい、保守しやすい、拡張しやすい…ものを目指す 勉強になりそうな本とか CSS Architecture | en.ja | Translated Articles for…

調べてみた。256個の.classを並べると#idを上書きの件

「ご存知、ないのですか?CSSの優先順位」 こんなスライドをあげてしまった手前(?) 256個の.classを並べると#idを上書きの件 について調べてみた。 (facebookで知人が話題にしてくれたおかげで調べられました…ありがとうございます) CSSのことですし、…

Android 2.1 で background-size が効かない問題

ベンダープレフィックスをつけると Android 2.1 でも background-size が指定できます。 .hage { background-size: 200px 40px; -webkit-background-size: 200px 40px;/*←これ*/ } …

テキストがはみ出た時に省略して「…」を表示するCSS

「text-overflow:ellipsis; 」とか使う。 css3 はみ出たのは隠しちゃう!っていうcssも入れる i改行無効もいれる .hage { white-space:nowrap; //テキスト改行無効 overflow:hidden; //width幅からはみ…