HTML5+CSS3を実践的に勉強する環境を整える

習うより慣れろがモットーの私です。
HTML5を早速あれこれいじくりまわしてみたいのですが、まずは環境整備が大事です。
個人的にはPCに依存せず、また編集・アップ・表示といった面倒な作業をなるたけ減らしたいと思っていましたが
素晴らしいWEBエディタを発見しました。これでネットさえ使えればどこでも勉強できますね。

html5

WEBエディタ
Liveweave
詳細な使い方記事はこちら

かなり軽快に反応してくれます。ソース書いたとたんにプレビュー表示してくれます。

ちなみに、適当に作ってみたサイトがこちら
CSSとJSを後でわけましたが、最初はHTML一枚ペラで制作しました。ブラウザのサイズによっては、変な表示になるかもです。
(タイトルくらいしかCSS3の威力が発揮されてませんが。。。)

ついでに個人的に扱いやすいと思ったCSS3のジェネレーターサイトを少しばかり。

背景・グラデーション

ボタン作成

ジェネレーターで自分の表現したいCSSコードを取得して、Livweaveの<style type=”text/css”>〜</style>内に書き込めば、ばっちし確認できます。

ラクラク、サクサクで楽しいですね〜。

他にも良いジェネレーターがあればまた追記します。

あとはソースのリファレンス用にこのあたりをいろいろ試してみればよいかと。


スポンサーリンク


コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です


*

日本語が含まれない投稿は無視されますのでご注意ください。(スパム対策)