HTML5, CSS3, jQuery, WordPress, Bootstrap, SublimeTextなど、フロントエンドのマークアップやコーディングに役立つチートシートを紹介します。 PDFや画像をダウンロードしたり、ブックマークしておいて、すぐに確認できるようにしておくと便利ですね。
![Web制作で分からないことはすぐに確認!HTML5, CSS3, jQuery, WordPress, Bootstrapなどのチートシートのまとめ](https://cdn-ak-scissors.b.st-hatena.com/image/square/91ea9f78056ba77ba138b130e978649d27054c31/height=288;version=1;width=512/https%3A%2F%2Fcoliss.com%2Fwp-content%2Fuploads-201502%2F2015091710.png)
Everybody loves classic games. How many of you remember the retro snake game from old Nokia phones? We sure do. This is why for this lesson we decided to recreate it using HTML5. There is a great open source game development framework called Phaser that we will use. You will learn about sprites, game states and how to use the preload, create and update methods. Here's what the final version of the
作成:2014/01/27 更新:2015/08/07 Web制作 > 前回、Web制作の一連の流れを書きましたが、今回は少し掘り下げて「コーディング」についてのフローをまとめます(HTML5+レスポンシブ+WordPress)。会社によって違うと思いますが、ざっくりとしたコーディングの流れと気をつけておきたいことをメモしています。 エンジニア速報は Twitter の@commteで配信しています。 もくじ コーディング前の準備 1.仕様書の確認 2.入稿データの確認・スケジューリング HTML5 マークアップ 3.テンプレート作成 4.条件付きコメント 5.GCF+キャッシュクリア 6.OGP記述 7.ファビコン 8.アウトライン作成 9.バリデーターをチェック CSS の設定 10.ノーマライズスタイル レスポンシブデザイン設計 11.モバイルファーストを基準に設計 12.プログレッ
WebページをRetina対応させるテクニック~実践編:jQuery×HTML5×CSS3を真面目に勉強(5)(1/3 ページ) 前回のWebにおけるピクセルの基本的な話を踏まえ、今回はRetinaディスプレイをはじめとした高精細ディスプレイにWebページを対応させるテクニックを紹介する。 前回(WebページをRetina対応させるテクニック~基礎知識編)はWebにおけるピクセルの基本的な話をしました。今回はそれを踏まえた上で、Retinaディスプレイをはじめとした高精細ディスプレイにWebページを対応させるテクニックを紹介します。 CSS Spriteで複数の解像度に対応 最も原始的な対応方法です。一般的なPCディスプレイと同じ要領で作成した画像をRetinaディスプレイに使用すると、にじんだように表示されてしまいます。デバイス上では同じサイズでも、使われているピクセル数のタテ・ヨコが2
2013-09-16 50行で作る、HTML5+JavaScriptで『ラングトンのアリ』の簡単プログラミング! やり方 適当プログラミング解説シリーズ はじめに。 ラングトンのアリ(Langton's ant)を知っていますか?ラングトンのアリはWikipediaのラングトンのアリによると、以下のように記述されています。 ラングトンのアリ(英: Langton's ant)は、クリストファー・ラングトンが発明した単純な規則で記述される2次元チューリングマシンである。 実際の3匹のラングトンのアリの早送りされた動きです。 一見複雑そうに見えますが、ルールはたったこれだけです。(上のgifでは色のあるマスが白のマスとしています。) 黒いマスにアリがいた場合、90°右に方向転換し、そのマスの色を反転させ、1マス前進する。 白いマスにアリがいた場合、90°左に方向転換し、そのマスの色を反転させ、
Here we have presented some amazing and impressive CSS3 and HTML5 experiments for you. Though, they are amazing but unfortunately are still at the state of being called ‘Experiments’, mainly because most of them are not supported by all the browsers. Therefore, we will recommend you that you see these CSS3 and HTML5 experiments either in Safari or Chrome. However, few of them work well in Mozilla
コーディングコンテスト "Q" vol.2を開催中です! jsdo.itで開催中のイベント「Web Creator's Contest "Q"」で「桜」を募集したところたくさんの投稿が集まっています。まだ募集期間中ですが、花見シーズンが終わる前に投稿作品の一部を紹介したいと思います! Web Creator's Contest Q Flashの名作をHTML5でリメイクしてください このFlashで作られた作品をHTML5でリメイクするのが今回の課題です。 SAKURA - wonderfl build flash online 投稿作品の一部を紹介! PLAYをクリックすると実行できます。STOPすると制作者のコメントとコードを閲覧する事が出来ます。 散り舞うSAKURA - jsdo.it - share JavaScript, HTML5 and CSS 奥行きのあるSAKURA -
Today we have a collection of some incredible and impressive HTML5 canvas and java-script experiments. Enjoy! Coil Google Gravity Canvas ribbon & iOS4.2 device orientation Sketch 404 BreakDOM Move. Pick Up. Drop Fight or Flight? (HTML5 game) Make3D: Native Drag & Drop in browser FlowerPower Conductor Z type webGL water Fish Tree HTML5 logo Test Canvascycle Asteroids – HTML5 Canvas and JavaScript g
Few days ago we shared best free Linux games surely you love to play. This time we going to present some best HTML5 canvas games. Firstly we introduced HTML5- this is the updated version of HTML( Hyper Text Markup Language) which used to design web pages. HTML5 has most of new and fresh features than older version that make it more flexible to use and popular among designers. Its getting more des
ヤフー株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。LINEヤフー Tech Blog はじめに こんにちは。R&D統括本部 制作本部 ウェブデベロップメント部に所属しております。岡部和昌(@kzms2)と申します。 最近スマートフォンやタブレット向けのページを作成する機会が増えてきました。 なので、今回はちまたで大人気のHTML5について書きます。 若干今更な内容にも思えますが、あまりHTML5になじみがない方にもわかってもらえるような内容にしています。 HTML5の基本概念や思想・実際の組み方というよりも、 HTML5で組むと今までと比べて何が違うのか などについて書いていきます。 なぜこれからHTML5なのか HTML4との違いがわからない HTML5を使う利点がわからない など疑問に思っている方はぜひ見ていた
ブラウザでスライドを表示し、HTMLベースで作成できるプレゼンテーション用のスライドを簡単な操作方法と合わせて紹介します。
CanvasLoader Creator [ad#ad-2] CanvasLoader Creatorの使い方は簡単で、右側の「Customizer」の値を変更するだけで、さまざまなタイプのローダーを作成できます。 キャプチャだと分かりにくいので、少し大きめにしていくつか作成してみました。 形状:Rounded Rectangle、Scaling:True 生成したローダーは「Download」ボタンをクリックすると、HTMLファイルをダウンロードできます。 「形状:Circle、Scaling:True」のコードは下記のようになります。 HTML L.9の「heartcode-canvasloader-min.js」とL.26-34のスクリプトがローダーの箇所になります。 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional/
HTML5 has been the talk of the town as of late, and now that we are well into understanding it’s strengths and awesome abilities to create jaw dropping websites. I have yet to dip my toes into HTML5, but no doubt the itch is there. With the following examples, you can see the possibilities of HTML5. The screenshots don’t do them justice, so be sure to check them out in a HTML5 compatible browser a
HTML5 is a popular among developers and designer. It is a new web technology lead by Apple. It is weapon for designer in creating new innovative web based apps. There are many tools out there for designers and developers, but getting by free and good ones is not that easy. I tried to get 10 best web based html5 tools for all developers. Hope you will like it. DeviantART muroThis is a HTML5 based a
Andreas Gal Entrepreneur. Technologist. Former CTO Mozilla, CEO Silk Labs. Now Update: I updated the links again. pdf.js has moved to a new location on github. Why? While traveling to the Firefox 4 launch parties in Seoul and Taipei all the way from California, we killed a lot of time by brainstorming cool things to do with the web platform. Like many before us, we were wondering why nobody had
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く