html・css・javascriptのメモ帳

html・css・jQueryのメモ帳

レスポンシブ対応ヘッダーメニューの作り方

コーディング初心者必見!レスポンシブ対応ヘッダーメニューの作り方です。パソコンでは横並びメニュー、スマホではハンバーガーメニューになります。htmlにPCとSPの別々のメニューを記載しなくて済むので便利です。一回覚えたら使い回し出来ます!
html・css・jQueryのメモ帳

スクロールすると背景色が変わるメニュー

スクロールすると背景色が変わるメニューをjqueryとcssで作成する方法です。コピペでも大丈夫ですが内容を理解しておくとカスタムが容易になると思います!結構使う盤面多いのでおすすめです。
html・css・jQueryのメモ帳

Web fontを使う

Web fontを使うために説明したブログです。無料のフォントでも可能性が広がります。
html・css・jQueryのメモ帳

モーダルウィンドウの作り方

htmlとcssとjqueryでボタンを押すと画像が現れるモーダルウィンドウを作っていく解説です。難しそうですがよく見るとjqueryの記述は少ないです。もちろんコピペで使えます。
html・css・jQueryのメモ帳

タイトルに装飾を疑似要素で付けます

よくある見出しにスラッシュを疑似要素で左右につけてみるcssの記述の仕方です。画像やテキストで表示させるよりこちらの方がおすすめですので是非見てみてください。
html・css・jQueryのメモ帳

cssで背景画像を fontの形で切り抜く

cssでテキストに背景画像を入れたい時の説明です。htmlとcssだけで出来ます。意外と簡単ですので是非ご購読くださいませ。
html・css・jQueryのメモ帳

ハンバーガーメニュー作成(2)

コピペでOK! cssだけで開閉させるハンバーガーメニューを作成します。中身が上から落ちてくる記述で作ってます。お手軽に作れますのでどうぞお試しください。
html・css・jQueryのメモ帳

jqueryとcssでハンバーガーメニューを作成する

jqueryとcssでハンバーガーメニューを作成する解説です。最近のウェブサイトはハンバーガーメニュー使うことが多いので知識として入れておくと便利です。他にもいろいろ作り方ありますが一例です。
html・css・jQueryのメモ帳

jqueryを使ってアコーディオンメニューを設置する

jqueryを使ってアコーディオンメニューを設置する説明です。コピペで簡単ですが説明もしてあります。css疑似要素、疑似クラスの説明もついでにしてあります。
html・css・jQueryのメモ帳

slick sliderを設置する

slick sliderの基本的な説明です。初心者にもわかりやすいように最低限の設置の説明です。slick sliderを設置できればホームページの見栄えが一気に上がりますので是非ご購読くださいませ。
タイトルとURLをコピーしました