カテゴリー別アーカイブ: HTML5 + CSS3

CSVファイルをドラッグ&ドロップでデータをtable表示してやんよ!!!

2017

6

5

通常ファイルをinput要素などから読み込んでFileAPIからプレビューさせるのがセオリーですが、 FileAPIの機能はinputさせなくてもファイルデータを取り込むことが可能です。 HTML・CSSでCSVファイル ...

続きを読む⇒

HTML5のWeb Storage使ってスケジュール表作ってやんよ!!!

2015

10

15

Web Storageの基礎知識 Web Storageとは? HTML5で追加された機能で、入力したデータをクライアントサイドのデータベース(ブラウザ)に保存できるようになります。 これまではクッキー(cookie)が ...

続きを読む⇒

HTML5とJavaScriptでPC・スマホのマルチタッチ対応してやんよ!!!

2015

8

8

レスポンシブデザインのようにサイトの仕様をPC・スマホ(タブレット)の両方に対応させるフレキシブルなページを設計するためには、各デバイスのイベントプロパティに詳しくなりましょう! PCとスマホ共通のイベント、スマホ特有の ...

続きを読む⇒

スマホ・タブレット端末でiframeが伸びてスクロール効かない対応してやんよ!!!

2014

2

1

スマホやタブレットではiframeが効かない現象・・・ ※正確にはiframeの高さの指定が利かずに内部コンテンツの中身がすべて出てしまう。 この現象は知っていましたが、いざ実際に遭遇するとけっこう厄介な代物だと気づかさ ...

続きを読む⇒

HTML5のFile APIでローカルファイル情報取得してやんよ!!!

2013

8

19

そろそろHTML5 APIのひとつでもリファレンスしていこうかな・・・ かといって今さらcanvasとかやってもしょうがないし、MathMLみたいなマニアックなものは覚えても使う機会があるかどうか・・・という事で 『Fi ...

続きを読む⇒

PC各ブラウザ・スマホ・タブレットごとの動画形式についてまとめてやんよ!!!

2013

5

30

動画コンテンツを制作するにあたってこれまでPCではFlash、スマホはMP4で設置しとけば何とかなる感がありますが、レスポンシブデザインサイトで制作する事を想定した場合、動画形式についてもブラウザ間の仕様やキャリア端末毎 ...

続きを読む⇒

『レスポンシブWEBデザインについてまとめてやんよ!!』

2013

5

16

年内から来年の内にタブレットの出荷台数がPCを超えるといわれ、いよいよサイト制作にもレスポンシブ化の必要性が日に日に大きくなってきました。 色々なサイトでレスポンシブデザインサイトの制作のポイントを紹介がありましたので、 ...

続きを読む⇒

『スマホ・タブレット別にmedia queryのCSS一覧作ってやんよ!!!』

2013

5

8

レスポンシブデザインのサイトやスマホ機種の解像度によってCSSの指定を振り分けられるmedia queryですが、クライアントによっては 「Apple製品だけきっちり見えれば良い」とか「ウチの社長のAndroidの○○だ ...

続きを読む⇒

float指定したボックスを含むボックスの背景も出してやんよ!!!

2012

9

6

今更感が否めない内容ですが、ふとこの状況になった際、不覚にもてこずってしまったので・・・ float指定した多重ボックスの背景を出す HTMLの記述(非対応) CSSの記述(非対応) で、この状態。 main_boxの背 ...

続きを読む⇒

『HTMLとCSSの小ネタ色々やんよ!!』の巻

2012

3

17

サイトを作る際、個人的に色々使える小ネタをストックするとします。 CSSだけで画像を上下中央に配置する clearfixの指定  

続きを読む⇒

「CSS3の『nth-of-type』って何じゃい!?」の巻

2012

2

16

CSS3の新セレクタの『nth-child』と『nth-of-type』が気になる今日この頃・・・。 という事で今回は『nth-of-type』を要チェックや!! 『nth-of-type』の使用例 このhtmlに以下の ...

続きを読む⇒

「CSS3の『nth-child』って何じゃい!?」の巻

2012

2

15

CSS3で新たに追加されたプロパティや値などは択山ありますが・・・ アニメーションやらトランスフォームやらの視覚的なモジュールが目立っていますが、 個人的に一番実践的に役立ちそうだなと思ったのが、nth-child と  ...

続きを読む⇒