CSSマウスオーバーで画像をズームするcss
html<div class="zoom"><img src="images/index-images/image01.jpg" alt=""></div>css.zoom {overflow: hidden;}.zoom { -webk...
CSS
CSSCSS投稿画像に便利cssでアスペクト比を固定
レスポンシブサイトでブラウザのサイズやデバイスが変わっても同じアスペクト比で変化していくcssHTML<div class="box"><div class="inner zoomin1"><a href=""><img src="imag...
CSScssで擬似インラインフレームをつくる
決まった枠内でスクロールできる擬似インラインフレーム .flame { overflow: auto; height: 200px; width: 100%; background-color: #f7efe9; border: sol...
CSSスマホの時に横スクロールさせる
スマホの時にtableをスクロールさせる <div class="scroll"><table><tr><td>テキストテキスト</td><td>テキストテキストテキスト</td> ...
CSSマウスオーバーで下にボーダー出す
.global-nav li a { position: relative; display: block; color: #fff; padding: 20px 30px; } .global-nav li a::after ...
CSS決まった枠内で縦横真ん中 レスポンシブデザイン
サイズがバラバラの画像を決まった枠内の中で縦横真ん中に配置するcss。 レスポンシブなので決まった枠も縦横可変。 .styling { width: 100%; margin: 0 auto; } .styling .img { ...
CSSYouTubeの埋め込みコードをレスポンシブ化する
.youtube { position: relative; width: 100%; padding-top: 56.25%; } .youtube iframe { position: absolute; top:...
CSSヘッダー固定時にアンカーリンクがずれる
headerを固定しているとアンカーリンクがずれる場合い、headerに高さを指定してあげると解消する。 クロームも