Webデザイン– category –
-
【jQuery-2】基本的な文法とその使い方をしっかり解説【.css】
前回は jQuery を導入するための準備と、文法について学びました。今回も基本的な文法を、実際に動かしてみて練習してみましょう。引数を複数とるメソッドもあります前... -
【jQuery-1】導入と基本的な文法をしっかり覚える【オワコン!?】
HTMLとCSSの基本をマスターして、ある程度のページを作ることができるようになったら、ページに動きを付けてみたくなりますよね。マウスを乗せると画像が切り替わったり... -
【flexbox】align-contentでwrapのかかった要素を配置変更する
flex-wrap で複数行にした要素を並び替えるプロパティ align-content を使ってみましょう。現在のレイアウトはフレックスボックスが主流です。ばっちり身に着けて、レス... -
【flexbox】flexwrapでアイテムを複数行に並べる方法
flexboxでは、並べられた各要素を一列に配置します。デフォルトの状態だと改行されずに各要素が小さくなって表示されてしまいます。今回ご紹介する flex-wrap は収まり... -
【flex-box】交差軸方向の配置を調整する方法
前回の記事では、フレックスボックスによるレイアウトの基本を解説しました。今回はもう一歩踏み込んで、さらに複雑な配置ができるようになることを目標に頑張ってみま... -
【flexbox】軸の方向を変更する方法【flex-direction】
レイアウトはフレックスボックスで行うと、特にレスポンシブ対応の際にいろいろと都合がよいです。ここではフレックスの「軸」について簡単に説明をしていきます。 【fl... -
【flex-box】レイアウトをする方法と主軸方向の配置変更
HTMLとCSSを使ったレイアウトの方法にはいくつか種類があります。以前はfloatをつかった方法が主流でしたが、最近では今回ご紹介するフレックスボックスかグリッドレイ... -
【図で解説】疑似要素の使い方がわかるようになる！
HTMLを学んでいて、私が最初につまづいたのが疑似要素でした。 いろいろ複雑なことが可能になる疑似要素ですが、基本を理解していれば応用にも対処できるようになってい... -
float,position,flexそれぞれのレイアウト方法
WEBサイトを制作するときに、思い通りに要素が配置されなくて悩むことが多くあります。そんな時に利用できるレイアウトの方法を3つご紹介いたします。 これらをうまく組... -
【box-sizing】border-boxを設定してCSSでのレイアウトをわかりやすく
CSSでレイアウトをするときに考えなくてはいけないのが各要素の大きさです。一つの要素、例えば<h1>要素や<p>要素を、または<div>や<header>な...
