tsukapiko
- web-tesign
- wordpress
- webデザイン技能士(2級)
- LittleBoxesMenuテンプレート
- .htaccessディレクトリ構成
- iMovieサンプルのエフェクト
- ページごとに別々のテンプレートを-2
- iMovie Ver.10.0.3*
- wordpressが壊れる
- MovableType/Joomla!/WordPress CMS比較
- Mac mini
- Fireworksが終了します。
- wordpressプラグイン-2
- googlemapカスタマイズtest2*
- WordPress 3.9 へようこそ
- 連携テスト
- youtube読み込みテスト2*
- WordPress×Facebook!記事自動連携2
- googlemapカスタマイズtest*
- レスポンシブチェックサイト
- ページごとに別々のテンプレートを
- WordPressの構成
- wordpressプラグイン
- joomla!使用モジュール
- Flashイラスト集
- twitter & Facebook
- contact
- このサイトの基本設定書
- tsukapikoのwordpressサイト
- joomla!
- HTML+CSS3
- etc.
- apple
- joomla!について
- sitemap
- skillsheet
- web-tesign sitemap
- ポップサークル*
- Home
- html+CSS3メディアクエリ
- 新規ページ 2
はじめまして、本サイトの管理人tsukapikoが既製にとらわれず自由奔放にdesignする手づくりで手探りなt-esignサイトです。
このサイトは、WordpressCMSによるレスポンシブを意識したスマホやタブレット等あらゆる端末の画面サイズに合わせて最適な見せ方を提供できるサイトの構成を目指しています。
サイズ指定は主にpxではなく%を使いながらのリキッドとなりますが、やはり一番困難を極めるのは、プレビュー方式が極端に違うIEハックの作業です。そして上部のメインビジュアルにはjQueryが組み込まれていますが、あえて画像にせずCSS3によるトランスフォーム指定を使う等々、今後の視覚的かつ効果的なサイトのあり方を探る意味で色々なデモを行っています。
ちなみにjQueryはWordPress本体に付属している様なので、これをfunctions.phpやheader.phpなどに書くだけで読み込まれます。
プラグインがこれを使ってjQueryを読み込んでる事も多いので、これを書いてなくてもjQueryが読み込まれてるかもしれません。複数のプラグインがこれでjQueryを読み込もうとしてたり、functions.phpのとで被ったりしても、wp_enqueue_script()は同じスクリプトは1回だけ読み込む様にうまい事やってくれます。あとはオリジナルのjQueryの指示がぶつかったりするので、$をjQueryに置き換えたりと、各種エラーそのままで(爆)、地道に検証するヒントにしたいサイトであります。
- http://html5-lab.jp/checker/ というサイトがあります。
Heading h1
Heading h2
Heading h3
Heading h4
Heading h5
Heading h6
一応ここでの基本フォーマット及び設定を公開しておきます。文字はスッキリととしたセンチュリーゴシックをメインにメイリオ〜ヒラギノを使っております。また今後、webフォントも使っていく予定です。以下に自分の別サイトですでにデモなるものを行っています。
body, td, th, div, p, label, input { font-family:"Century Gothic",Arial,"メイリオ","Meiryo", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN","MS Pゴシック", "MS P Gothic", Verdana, Arial, Helvetica, sans-serif; }
コラムの指定全文を読む… «このサイトの基本設定書»