"CSS" Archive

ガラケーサイトとCSS、それに至るまでの話

当日にいろいろ重なって盛大に遅刻してしまいました。
クリスマスも過ぎてしまいましたが、年内に登録したアドベントカレンダーは書いてしまいたいので書きます!

さて、CSS昔話アドベントカレンダー21日めの記事です。

CSSの猛者がきっと色んな話をしてくれてると思うので、奇をてらって「一方その頃ガラケーは…」みたいな話をしようと思います。
(さらに…)

Tags

SVGをborder-imageで使ってみました

CSS3で追加されたborder-imageにSVGを使ってみよう!と色々やってみて、分かったことをまとめました。

(さらに…)

Tags

更新情報などのリストの組み方、どうしてます?

新しいコンテンツとして、こういうデザインのとき、どうやってコーディングするのか?というのを考えるカテゴリ「Desico」を作ってみました。
Design + Coding = Desico ってことです。
本当は別サイト立ち上げてやろうかなーと思ったんですが、続くかどうか分からないので…w とりあえずブログでやってみます。

最初はサイトではよくある更新情報のリスト。
どんな組み方があるんでしょうか?

(さらに…)

Tags

レスポンシブ化する時に知っておきたいCSSテクニック

今年の夏もCSSでうにょーんとなっていました。
(毎年いただくお仕事なんですが、毎回頭をひねる…。お陰で勉強になっていますが)
今回は普通に組まれたHTML(元々レスポンシブする予定じゃなかったやつ)をレスポンシブ対応する作業がおおくて、ああこうすればいいのか…!というのが多かったので、まとめておきます。
(さらに…)

Tags

SassやLessなどCSSメタ言語を手軽に試してみた話

最近話題のCSSメタ言語。
SassとかLESSとかstylusとかいうヤツですね。
ちょっとした空き時間に触ってみたいなーと思っても、node.jsを入れてーとか、コンパイラがーとか、準備の段階で怖気づいてしまい、結局どういうものなのかよく分からないまま放置していました。
しかし、手軽に試せる方法に気付いてしまいました…。
(さらに…)

Tags

ark-under.netのトップをリニューアルしました

実は、ark-under.netっていうサイトを、もうかれこれ7年ほどやってるんですが(ドメインをとったついでに改名。その前はark-underで、たいして変わらない)そのページを3年ぶりにリニューアルしましたよ、というお話。
(さらに…)

Tags

1ファイルを3メディアでそれなりに見れる方法を考えてみた

先日のTwitterのTLはなぜか血液型の話題(主にO型さん)でいっぱいでした。ちなみに私は面倒臭がりのA型です。
面倒くさがりなので、楽な方法を常に模索しています。

そんな話はさておき、世の中のメディア(Webページを閲覧出来る端末)をざっくり分けると、PC/タブレットPC/モバイル(ケータイ&スマホ)の3メディアが今のところあるようです。
それぞれのページに合わせて、HTMLファイルを用意したりするのは面倒。振り分けのためのCGIを設置するのも面倒。

CSSとJavaScript貼付けるだけでそれなりに見栄えがよく出来るような、そんなテンプレートがあったら便利かもしれない!という思いつきでちょっと作ってみました。

(さらに…)

Tags

よく使うロールオーバーのメモ

ナビゲーションやボタンとなる画像は、ロールオーバーで変化を持たせておくとサイトを見ている人にとても親切です。
Dreamweaverなんかを使えば簡単に設置出来ますが、Dreamweaverの吐き出すJavaScriptのコードはあまり綺麗ではないので嫌い!とかCSSで実現したい!とかDreamweaver持ってない…といった感じの人向けに、仕事や制作でよく使ってるロールオーバーをメモしておきます。
(さらに…)

Tags