CSS
今日もスマートフォン専用サイトの授業。 架空のweb制作会社のサイトつくった。 長くなるのでjsのブログでの記述はカットします。 jsでの記述はheader画像にflexsliderを使ったsliderと内容部分にtoggleを使った開閉式のタブパネルを使ったというところです…
今日の授業はスマートフォン専用サイト。 スマートフォン専用サイトはクロームのF12の開発ツールで確認できるようだ。 クロームのF12を押して左上のスマートフォンのアイコンをクリックすると各種デバイスでの動作をエミュレーションできる。 スマートフォン…
今日の授業は擬似セレクタとレスポンシブサイト制作。 clearfixの理屈が分からなかったが、今日の授業で理屈が分かった。 擬似セレクタを使うことでボーダーが大きいときに発生する斜めの部分を利用しフキダシを作ることもできる。面白い使える。 擬似要素 …
擬似セレクター:nth要素:nth-child(式)(○個目から△おき)li:nth-child(2n+1)例nが0の時は1 例nが1の時は3 例nが2の時は5 以下例 nth-child(2n+1)奇数 nth-child(2n)偶数 nth-child(3n)3,6,9,12・・・番目 nth-child(3n+1)1,4,10,13・・・番目 nth-child(5…
今日はtransformとtransitionの授業に入った。 transformは変形。transitionは徐々に指定した値に変化させる。 今まで両方使ってきたが指定の仕方に癖がある。書き方transform:rotate(10deg);10度回転 transform:scaleX(2);横に2倍、-に設定すると3D回転の…
CSS3の勉強の続き。今日はlinear-gradient/radial-gradient/background-size/background複数枚指定のお勉強。 この授業に入る前に使っていたのはlinear-gradient/background-size/background複数枚指定だ。 radial-gradientだけ使いどころがなく使ってこなか…
今日からCSS3の授業に入った。CSS3は前から使っていたが楽しくて久々にテンションが上がる。 最近ではCSS3でできることが多く使われていないサイトは皆無だと思う。 CCS3でできているマウスオーバーアクションなどは大好物です。 (´・ω・`) ただW3Cの行動が…
webを作っていると使うことが多いdl/dt/ddの横並び。 dlは文書構造上、定義や説明を意味するため、「面倒くさいからtableやlistでいいか~」とはならない。 文書構造が重要になっている今無視はできない。学校でも習っているのだが覚えては忘れ、覚えては忘…
ふと授業でブロックレベル要素、インライン要素、ブロックレベル要素の違いを講師が説明してくれた。わずか2~3分の話だったが勉強になった。 ブロックレベル要素とインライン要素の違いは分かるもののブロックレベル要素の使い方がいまいち分からなかったた…
昨日の勉強会でコーディングのスピードが遅かったため、練習サイトでコーディングの練習をした。素材は用意されている状態で2枚で4時間位。2ページやると忘れていることも多いことに気付く。そろそろポートフォリオを作らないといけないのでこれも載せること…
今日は学校は休みだったが他の生徒さんが開いた勉強会に参加してきた。ポートフォリオの作品を増やすのが目的だ。個人的にはこういった勉強会は具体的な目的があるため好きだ。 シンプルなグリッドレイアウトだが最近コーディングよりWordPressやMySQLの授業…
CSS・リセットCSSとノーマライズCSS ブラウザは初期状態からmarginやpadding等、デフォルトでCSSが設定されている。便利な所もあるのだかブラウザによってその設定が微妙に違うのが困るところだ。そのためブラウザに設定されているデフォルトのCSS設定を一度…