Baccho Log

スマホとPCで画像を切り分けしたい場合が結構あります。 その際、imgタグで組む場合にdisplay: none;で切り替えたり、jsでsrcを変更したりやってきましたが、 スマートじゃないため調べたところ、srcset…

<div class=”sample”> <div> <input type=”radio” name=”radio-sample” id=”radio1″><label for…

概要 横に並べたり、リストを逆から並べたり、 テーブルレイアウトにしたり、レスポンシブに動かしたり…etc 今まで float: left とか display: table とか色々駆使して作成していたもの…

テキストに影をつける text-shadow: 横方向 縦方向 ぼかし 影の色; Ex.1)右下に影をつける .list2 ul li a { text-shadow: 5px 5px 2px #00f; display…

外枠を二重線にする 上下二つにレイアウトを分けて、二重線で枠を囲みたい場合です。 border: doubleを使う Ex)境界線を確実に区分けする <div class=”content”> <div…

角を丸くする方法 共通 html <div class=”list”> <ul> <li><a href=”#”>ナビ1</a></li> <…

リストの横並びと左右中央揃え 左右中央に揃える際に重要なのが 揃えたい要素が「インライン要素」か「ブロック要素」かです。 li 要素はブロック要素のため、横並びにするにはいくつか方法があります。 float を設定する方…

基本的なことをつらつら ▼参考 http://webdesignrecipes.com/css-visual-formating-model/

head metaタグ referrer <meta name=”referrer” content=”●●”> 設定値(content)としては、次のものが定…