Last active
March 31, 2018 10:31
-
-
Save EfremovMS/ad4e204dafab3618be1d7708617f6294 to your computer and use it in GitHub Desktop.
CSS start
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/* ___________1. Сброс CSS_____________________ */ | |
a,abbr,address,article,aside,audio,b,blockquote,body,canvas,caption,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,html,i,iframe,img,ins,kbd,label,legend,li,mark,nav,object,ol,output,p,pre,q,ruby,s,samp,section,small,span,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,u,ul,var,video{margin:0;padding:0;border:0;font-size:100%;vertical-align:baseline}article,aside,details,figcaption,figure,footer,header,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote::after,blockquote::before,q::after,q::before{content:'';content:none}table{border-collapse:collapse;border-spacing:0}input[type=submit],input[type=reset]{cursor:pointer}::-moz-focus-inner{padding:0;border:0} | |
* { | |
-webkit-box-sizing: border-box; | |
-moz-box-sizing: border-box; | |
box-sizing: border-box; | |
} | |
*::before, | |
*::after { | |
-webkit-box-sizing: border-box; | |
-moz-box-sizing: border-box; | |
box-sizing: border-box; | |
} | |
a:focus, | |
input:focus, | |
textarea:focus { | |
outline: 0 none; | |
} | |
/* ___________2. Типовые элементы______________ */ | |
/* _______________2.1. Заголовки_______________ */ | |
h1 {} | |
h2 {} | |
h3 {} | |
/* _______________2.2. Ссылки__________________ */ | |
a { | |
color: inherit; | |
text-decoration: underline; | |
-webkit-transition: all .3s ease; | |
-o-transition: all .3s ease; | |
transition: all .3s ease; | |
} | |
a:hover { | |
text-decoration: none; | |
} | |
/* _______________2.3. Элементы форм___________ */ | |
input[type="text"], | |
input[type="password"], | |
input[type="tel"], | |
input[type="email"], | |
textarea { | |
display: block; | |
padding: 0 10px; | |
width: 100%; | |
height: 30px; | |
line-height: 30px; | |
font: normal 16px 'Open Sans', sans-serif; | |
color: #000; | |
background: none; | |
border: none; | |
-webkit-transition: all .3s ease; | |
-o-transition: all .3s ease; | |
transition: all .3s ease; | |
} | |
::-webkit-input-placeholder { | |
opacity: 1; | |
color: #000; | |
} | |
::-moz-placeholder { | |
opacity: 1; | |
color: #000; | |
} | |
:-moz-placeholder { | |
opacity: 1; | |
color: #000; | |
} | |
:-ms-input-placeholder { | |
opacity: 1; | |
color: #000; | |
} | |
textarea { | |
margin: 0; | |
padding-top: 10px; | |
padding-bottom: 10px; | |
height: 200px; | |
} | |
input[type="text"]:hover, | |
input[type="password"]:hover, | |
input[type="tel"]:hover, | |
input[type="email"]:hover, | |
textarea:hover {} | |
input[type="text"]:focus, | |
input[type="password"]:focus, | |
input[type="tel"]:focus, | |
input[type="email"]:focus, | |
textarea:focus {} | |
/* _______________2.4. Сетка___________________ */ | |
.container { | |
display: flex; | |
flex-direction: column; | |
position: relative; | |
margin: 0 auto; | |
padding: 0 15px; | |
max-width: 1200px; | |
} | |
.container__row { | |
display: flex; | |
flex-flow: row wrap; | |
align-items: flex-start; | |
justify-content: start; | |
align-content: flex-end; | |
margin: 0 -15px; | |
} | |
.container__col { | |
padding: 0 15px; | |
width: 50%; | |
min-height: 1px; | |
} | |
/* _______________2.5. Базовые_________________ */ | |
html { | |
font-size: 100%; | |
height: 100%; | |
} | |
body { | |
height: 100%; | |
background: #fff; | |
color: #000; | |
font: normal 100%/1 'Open Sans', sans-serif; | |
} | |
.clear { | |
display: block; | |
clear: both; | |
} | |
.none { | |
display: none; | |
} | |
.no-scroll { | |
overflow: hidden; | |
} | |
img { | |
max-width: 100%; | |
} | |
.button { | |
display: inline-block; | |
padding: 5px 10px; | |
font-size: inherit; | |
font-family: inherit; | |
-webkit-appearance: none; | |
-webkit-transition: all .3s ease; | |
-o-transition: all .3s ease; | |
transition: all .3s ease; | |
} | |
/* _______________2.6. Шрифты__________________ */ | |
/* _______________2.7. Другие__________________ */ | |
/* ___________3. HEADER (Шапка)_______________ */ | |
/* ___________4. SECTION (Контент)_____________ */ | |
/* ___________5. FOOTER (Подвал)______________ */ |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment