arrow-left arrow-right envelope facebook feedly folder home html-tag person tag twitter wordpress rss user get-pocket envira google-plus

[jQuery]簡単!スライドショーを作ろう!!

Webの世界は分進秒歩くらいの勢いで変わっていきますが、そのなかでも未だによく使われるみんな大好き(?)スライドショーについて今回は書きたいと思います。幾つかの画像を用意して時間遷移で見せていくのですが、スライドショー自体に長い歴史があるようで様々なやり方があります。今回は比較的簡単なものを紹介します。

続きを読む

Emmetで爆速コーディングを始めよう!- CSS編

前回はEmmetのHTML編として省略記法の基本をご説明しました。今回はCSS編です。Emmetの便利さはCSSの方が感じやすいと思います。初めは戸惑うかもしれませんが、使い続けていくうちにEmmetなしでCSSを書くのがバカバカしくなるほどの便利さと速さを実感できると思います。ここまでがEmmetの基本となります。

続きを読む

Emmetで爆速コーディングを始めよう!- HTML編

前回はEmmetの導入部分までをやりました。テキストエディタは決まりましたでしょうか?今回からが本番、速くコードを書くための省略記法を説明していきます。内容盛りだくさんですが、基本を押さえながら実際に書いていくのが覚える近道です。さっと目を通してゴリゴリとコードを書いていきましょう。

続きを読む

Emmetで爆速コーディングを始めよう!- 導入編

ものぐさな私が大好きなEmmetについて書く日がやってきました。HTMLコーディングを改めて学習したいと思うようになったきっかけでしたので、感慨もひとしおです。 と言いながらサクッと行きます。基本的なことを押さえたらどんどんコーディングして、コーディングはちょっと苦手…なんて人も「まぁ苦手ではなくなったかな」と思えるような、そんなツールの一つです。

続きを読む

[CSS]floatからFlexboxへ、新世代ブラウザへの対応を始めよ・・・

現在のWebデザインはスマートデバイスの普及によって小さなモニタにも柔軟に対応するレスポンシブデザインが必須となり、floatやclearハックを駆使してレイアウトを組んでいたWebコーディングもこれからはCSSに書き足すだけで柔軟なレイアウトが組めるFlexboxが主流になってくると思います。今回から2回に渡って説明します。

続きを読む

[CSS]画像と文字を重ねてみよう〜position編vol.2

前回はCSSの中でも重要なpositionに関する記事を書きました。大体使いどころが決まっているということが頭に入っていると、混乱せずにCSSを扱えるようになってくるのではと考えています。今回は前回を踏まえて画像の上に文字を重ねる、そして意外に使う場面の多い重なり順についても書いてみます。

続きを読む

[CSS]「なんとなく」から「確実」に ~position編

コードを書いていて「これをこうしたい」と人様のコードをなぞって思い通りにうまくいってしまうと「なぜこれはこういう動きになるのだろう?」と考察することを忘れてしまいがちです(私もやらかします)。今回書くことになるCSSのプロパティであるpositionはdisplayと共にレイアウトでは重要なものなので、この際完璧にしておきましょう。

続きを読む

刷新されたDreamweaver CC 2017は中々いいかも…

AdobeMAXTVを観る機会があり、HTMLやCSSのコードを書くのが好きな私は下記の理由からDreamweaverに注目していました。元々Dreamweaverに良いイメージがなく、昔使っていたCS2もコーディングを再開した一昨年から試したCS6もCC2015も「重い、見辛い、何となく面倒」と遠慮していたのですが…

続きを読む

PAGE TOP