webかたつむり ウェブデザインを勉強中 ウェブ初心者のおぼえがき

webかたつむり

ウェブデザインを勉強中

2017-07-16から1日間の記事一覧

Humberger Menu 自己流備忘録

某案件のため、(PC SPの切り替えで要素の移動が激しいソースだった、、、)時に作ったハンバーガーメニュー。作った日の備忘録。 ハンバーガーメニューのコーディングは昔から大嫌いです、、、がよく作らされます。 1. まず外側の正方形を作る。今回は<p> id="bt</p>…

ハンバーガーメニュ

ハンバーガーメニューの実装 (by yachin29) <nav> <div id="btn"><span id="hum"></span></div> <ul> <li><a href="#">Home</a></li> <li><a href="#">Shop</a></li> <li><a href="#">Collections</a></li> <li><a href="#">Philosophy</a></li> <li><a href="#">Press</a></li> <li><a href="#">About</a></li> </ul> </nav> スタイルシート @m…

display:none, visibility:hidden の違い

他のサイトからの転載。よくわかりました! visibility:hiddenは名前の通り、要素はあるけど見えない状態。display:noneは、要素も取得されず、完全にその場にない扱い。 検証準備 html <html lang="ja"> <head> <meta charset="UTF-8"> <title>difference between visibility hidden and display none</title> <link rel="stylesheet" href="css/style.css"> </head> <body> </body></html>

sp pc 画像変換

レスポンシブデザインでPC用の画像と、SP用の画像を変えるときに使うスクリプト。今回の案件では、bxsliderの画像(比率)をPCとSPで変えるため、PCとSPでボタンの画像を変更するために使いました。 1. 画像のフォルダに、PCとSP用の画像を用意しておきます…

GitHubとSourceTreeの導入

GitHubとSourceTreeの導入 - WEBサイト制作の勉強からの転載 自分のレファレンス目的です、、、 GitHubとSourceTreeの導入 Git(ギット)とは、バージョン管理を行うためのツールのことです。複数人でプログラミングやコーディングを行う場合、ソースコード…