sanitize.css

このデザインについて

sanitize.cssmmmgames サンプル
カテゴリー:シンプルベーステーマ:hatenaヘッダー:標準(細)
登録日:2016/01/28更新日:2016/01/28利用数:23

ヘッダ/フッタ/スタイルシート

ページのヘッダ

<h1><hatena name="title"></h1>

ページのフッタ


スタイルシート

/*! sanitize.css | CC0 Public Domain | github.com/jonathantneal/sanitize.css */
pre,textarea{overflow:auto}
:root,[aria-disabled]{cursor:default}
[hidden],audio:not([controls]),template{display:none}
button{overflow:visible}
details,main,summary{display:block}
input[type=number]{width:auto}
input[type=search]{-webkit-appearance:textfield}
input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none}
progress{display:inline-block}
small{font-size:75%}
textarea{resize:vertical}
*,::after,::before{box-sizing:inherit;border-style:solid;border-width:0}
*{background-color:inherit;font-size:inherit;line-height:inherit;margin:0;padding:0}
::after,::before{text-decoration:inherit;vertical-align:inherit}
:root{-ms-overflow-style:-ms-autohiding-scrollbar;overflow-y:scroll;-webkit-text-size-adjust:100%;box-sizing:border-box;font:1pc/1.5 sans-serif;text-rendering:optimizeLegibility}
html{background-color:#FFF;color:#000}
a{text-decoration:none}
audio,canvas,iframe,img,svg,video{vertical-align:middle}
button,input,select,textarea{background-color:transparent;color:inherit;font-family:inherit;font-style:inherit;font-weight:inherit}
[type=number],[type=search],[type=submit],[type=tel],[type=text],[type=time],[type=url],[type=week],[type=button],[type=date],[type=datetime],[type=datetime-local],[type=email],[type=month],[type=password],[type=reset],button,select,textarea{min-height:1.5em}
code,kbd,pre,samp{font-family:monospace,monospace}
nav ol,nav ul{list-style:none}
select{-moz-appearance:none;-webkit-appearance:none}
select::-ms-expand{display:none}
select::-ms-value{color:currentColor}
table{border-collapse:collapse;border-spacing:0}
::selection{background-color:#B3D4FC;text-shadow:none}
[aria-busy=true]{cursor:progress}
[aria-controls]{cursor:pointer}
[hidden][aria-hidden=false]{clip:rect(0 0 0 0);display:inherit;position:absolute}
[hidden][aria-hidden=false]:focus{clip:auto}
/*# sourceMappingURL=sanitize.css.map */



:root {
	background: #EEE;
	height: 100%;
}

body {
	background: #FFF;
	margin: 0 auto;
	max-width: 70rem;
	min-height: 100%;
}

@media screen and (max-width: 639px) {
	body {
		padding: 10%;
	}
}

@media screen and (min-width: 640px) {
	body {
		padding: 4rem;
	}
}

h1 {
	font-size: 300%;
}

h2,
hr {
	padding-top: 1.5rem;
}

h2,
subhead {
	line-height: 1.25;
	margin-bottom: 2rem;
}

h2,
hr {
	box-shadow: 0 -.5rem 0 0 rgba(0,0,0,.1);
	font-size: 1.5rem;
	margin-top: 2rem;
}

h3,
p,
pre {
	margin-top: 1rem;
}

p {
	line-height: 2;
}

pre {
	background-color: #F8F8F8;
	color: #333;
	line-height: 1.5;
	padding: 0.75em .625em;
}

subhead {
	color: rgba(0,0,0,.5);
	display: block;
	font-style: italic;
}

subhead > span {
	display: inline-block;
}

.btn {
	background: linear-gradient(to bottom, #3498DB, #2980B9);
	border-radius: .25em;
	color: #FFF;
	display: inline-block;
	margin: 0 .25em .25em;
	padding: .5em 1em;
}

.chatter {
	color: #555;
}

.chatter a {
	box-shadow: 0 1px 0 0 #55F;
	color: #55F;
}

span[data-keyword] { color: #A71D5D; }
span[data-method]  { color: #0086B3; }
span[data-string]  { color: #ED6A43; }

.diff {
background: #FAFAFA;
}