
角丸にドロップシャドウ、グラデーションにアニメーションなど、超簡単にCSS3スタイルの作成&コード生成をしてくれる「CSS3 ジェネレーター」まとめ!! html5-css3-orange-logos / Nelson Felix Giga どうも!おつぱ( @OZPA )です! 今回は、角丸やドロップシャドウ、グラデーションに2D/3Dアニメーションなど、CSS3に対応したスタイルを簡単に作成、さらにコードを生成してくれる「CSS3 ジェネレーター」を厳選して8つご紹介! ウオアアアアアアアア さて、CSS3対応ブラウザも増え、角丸、ドロップシャドウ、グラデーションにWebフォント、はたまた2D/3Dのトランスフォーム(回転/拡大縮小/移動)やアニメーションなどなど…リッチなUIがコードのみで表現できるようになりました。 関連:[CSS]GoodDesign賞にノミネートされて落選するこ
CSS3で、ダミーテキストを簡単に表示できるのか? 2012-06-14 サイトを制作する時は完全原稿で進めたい。 とりあえずJavaScript ダミーテキストを出してくれるjQueryのプラグインもあるので、試してみてもいいかもしれません。 lorem.js - github lorem.jsの記述 <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> <script src="lorem.js"></script> <div data-lorem="2p"></div> <img src="" data-lorem="gray" width="100" height="124"> ただdata-*属性を付けるのが面倒な
Introduction In the ever-evolving landscape of web browsing, staying abreast of the latest technologies is crucial. HTML5, the fifth and current version of the Hypertext Markup Language, has revolutionized the way we experience the web. With its advanced features and enhanced capabilities, HTML5 has become the cornerstone of modern web development, offering a more seamless and interactive user exp
Metro UI CSSはWindows 8のMetro UIをHTML5/CSS3で再現したソフトウェアです。 次期WindowsのWindows 8ではMetro UIと呼ばれる新しいインタフェースが利用されています。そんなMetro UIをCSSで再現したのがMetro UI CSSになります。 デスクトップで見たイメージです。アイコンが並んでいます。 選択できる画像リストです。 選択できるリストです。画像も埋め込めます。 チャットなどで使えそうなリストです。吹き出しもついています。 アプリケーションリストです。 時計などのウィジェットです。 iPadでの表示です。タブレットの方が最適化されています。 左右の移動もできます。 デモ動画です。動きはスムーズです。 動きはかなりスムーズで格好いいです。パネルを押すとちょっとへこんだり、ボタンも多数用意されています。リストをタップして選択し
【即日満員/増員400名】第1回 渋谷 HTML5+CSS3+JS de ゲーム勉強会 html5技術講座 x コロプラ事例発表 : ATND http://atnd.org/events/25251 ソーシャル時代に見るWeb系エンジニア生き残り戦略 - mochrom クロカワ リュートさん なぜ戦略が必要なのか ターゲットユーザを明確にし ターゲットユーザーに響く方法で告知をし 長く愛されるサービス/アプリを目指す 集客の方法・事例 「MacBook Airは中華包丁としてつかえるのか。」 「これ、中華包丁みたいだ。」から始まった 関連動画も含めた総再生数は100万再生超 国内ではGIZMODO JAPAN、デイリーポータルZ、ねとらぼ、秒刊サンデー。海外ではGIZMODO、CNN、Yahoo!香港、ディスカバリーチャンネルなどで取り上げられた 気をつけている事 ティザーは打たない
Dirty Markup [ad#ad-2] Dirty Markupはウェブ制作者がよく使う下記のツールをまとめたような感じです。 HTML Tidy CSS Tidy JS Beautify Dirty Markupの使い方は簡単で、右側にコードをペーストし、左側でHTML/CSS/JavaScriptを設定し「Clean」ボタンをクリックするだけです。
Learn HTML5, CSS3, Javascript and more... Video style walkthroughs showing cool stuff being created from scratch
reveal.jsはCSS3/JavaScriptで作られたプレゼンテーションソフトウェアです。 reveal.jsはHTML5/CSS3を使ったプレゼンテーションソフトウェアです。まずは言うに及ばず、そのクールな画面を見てもらいましょう。 トップです。この雰囲気からして格好いいです。 スライドを切り替える時に3Dイフェクトがかかります。これまた格好いいです。 水平に動くのが基本ですが、垂直にスライドさせる指定もできます。 デモ動画です。スペースキーでスライド一覧が出せます。 reveal.jsはスライドの切り替えがとにかく格好いいので、これでプレゼンテーションを行えば観衆の注目を引くこと間違いないでしょう(もちろん内容が大事ですが)。 reveal.jsはCSS3/JavaScript製、MIT Licenseのオープンソース・ソフトウェアです。 MOONGIFTはこう見る プレゼンテー
Introduction In the ever-evolving landscape of web browsing, staying abreast of the latest technologies is crucial. HTML5, the fifth and current version of the Hypertext Markup Language, has revolutionized the way we experience the web. With its advanced features and enhanced capabilities, HTML5 has become the cornerstone of modern web development, offering a more seamless and interactive user exp
jsdo.itで「SPEC」というコーディングコンテストを開催しています。 今回のテーマは以下の二つ。 CSSだけを使って必殺技の演出を加えてください ローディングの演出を考えてください 「こんなマニアックなテーマだけど参加してくれる人がいるのだろうか…!」と心配していたのも杞憂に終わり、続々とすごい作品が投稿されています。 開催期間中ですが、ぼくが個人的に「これは!」と思った作品をピックアップして紹介したいと思います。(コンテストの審査とは関係ないですよ!) CSSだけを使って必殺技の演出を加えてください スーファミのRPG風 えい!:forked: CSSで必殺技! - jsdo.it - share JavaScript, HTML5 and CSS 光が集まる必殺技 forked: CSSで必殺技!第2弾! - jsdo.it - share JavaScript, HTML5 a
こんにちは、鴨田です。 個人的に仕事の大半はスマートフォン関連なので、 最近のマークアップはほとんど全てHTML5+CSS3で行っています。 とはいえ、PC向けのサイトではまだまだHTML4.01、XHTML1.0、CSS2.1を使用している場合が多いと思います。 ですので、今回はHTML5+CSS3を導入するにあたって、役立つと思う7つの設定について、書きたいと思います。 1.HTML5の初期テンプレート案 <!DOCTYPE html> <html> <head> <meta charset=utf-8 /> <title>HTML5 初期テンプレート</title> <!-- reset.cssの設定 --> <link rel="stylesheet" media="screen" href="reset.css" /> <!-- Viewportの設定 --> <meta nam
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く