タブで開くメニューを作成しました DEMOはこちらです スクリプト部分 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js?ver=1.8.3"></script> <script> $(function(){ $("#tabMenu li a").on("click", function() { $("#tabBoxes div").hide(); $($(this).attr("href")).fadeToggle("slow"); //slowもしくはfast }); return f…

DEMOはこちらです スクリプト部分 slideToggle("fast")や、"slow" など。 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js?ver=1.8.3"></script> <script> $(function(){ $("#acMenu dt").on("click", function() { $(this).next().slideToggle(); }); }); </script> html部分 dtをクリックすると、ddが開く。

htmlだけでは、ただのテキストファイル(文字だけのファイル) ほかのファイルを呼びこんで、ブラウザに表示させます。 HTMLでできること 作る人の基本はHTMLです。文書を意味付けします。 HTMLの機能のひとつに、リンクがあります。 →ページ間を飛ぶほか、プ…

見る人・作る人・置き場所 作りたい人がいれば、見る人もいます。 見る環境をユーザーエージェントとも言います。 見る環境は人も国も、デバイスも、いろいろです。 だれかがWEBサイトを見てる時 関係性が生まれます。 見る人→ ユーザー ファイルの置き場所→…

DEMOはこちらです Keyword % em pxxx-large172.8% 1.728em 27.6pxx-large 144.0%1.440em23.0px large 120% 1.200em19.2pxmedium 100% 1.0em 16.0pxsmall 80% 0.800em12.8px x-small 64% 0.640em 10.2pxxx-small 51.2% 0.512em8.2px

別にきまりなんかないそうです。 そろっている→ 整頓 バラバラ→ 開放 ページ物は、そろっている部分と、そろってない部分を持たせると、統一感&ページの差ができる。 有効につかう 空きによって印象が大幅に変わる。 ムダじゃない。 ただの空きじゃない。 今…

今回はデバイスのサイズを取得するviewport - 思い描いたものを表現するための みためやらプログラムのつづきです。 DEMOはこちら <meta name="viewport" content="width=device-width; " /> デバイスのサイズを取得させる スマートフォンの画面で、WEBページを表示する時 擬似的に縮小して表示されてしまうから→ちい</meta>…

PC、スマホ、タブレット。 見る環境で、スタイルを限定出来るのがメディアクエリ(CSS3)。 以前はCSS2のmedia="screen,print" さらに、拡張ができるようになった。DEMOはこちら @media タイプ and (限定条件){ /*スタイル*/ } htmlは基本構造で作成しました c…

好きな色をカラーピッカーで選び、 そこから背景色とアクセントを考えてみました。 面の占める割合 基本色25% （割と広い) アクセント5% 背景色70% (かなり広い) 基本色→好きな色 印象から選びました 明度は低めにする 基本色は"濃い色" 白文字が乗ると文字…