/* 擬似要素
------------------------- */
.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.