CSSスニペット

/* 擬似要素 ------------------------- */ .main-content-area em::before { content: "【"; } .main-content-area em::after { content: "】"; } /* テキストシャドウ ------------------------- */ /* 白い影 */ p { text-shadow: 0 1px 0 rgba(255,255,255,1); } /* 黒い影 */ p { text-shadow: 0px 0px 2px rgba(0,0,0,.8); } /* ボックス影 */ div { box-shadow: 0px 10px 15px -10px rgba(0,0,0,.4); } /* テキストカラー ------------------------- */ /* 白 */ p { color: rgba(255,255,255,.65); } /* 黒 */ p { color: rgba(0,0,0,.65); } /* オレンジ色 */ p { color: rgba(255,148,0,.65); } /* 「…」(エリプシス)付与して、CSSのみで省略 ------------------------- */ .caption { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } /* micro clearfix ------------------------- */ /* 2016年版:モダンブラウザ用 参考)http://coliss.com/articles/build-websites/operation/css/css-latest-clearfix.html */ .cf::after { content:" "; display:block; clear:both; } /* 2011年版:IE6/7対応 参考)http://coliss.com/articles/build-websites/operation/css/css-micro-clearfix.html */ /* For modern browsers */ .cf:before, .cf:after { content:""; display:table; } .cf:after { clear:both; } /* For IE 6/7 (trigger hasLayout) */ .cf { zoom:1; }

Be the first to comment

You can use [html][/html], [css][/css], [php][/php] and more to embed the code. Urls are automatically hyperlinked. Line breaks and paragraphs are automatically generated.