常用到的 CSS
多余变 …
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;字体引用
font-face {
font-family: 'raleway-regular';
src:url("./fonts/Raleway-Regular.ttf");
}渐变遮罩层
background-image: -moz-linear-gradient( 90deg, #f8cb40 0%, #ffd143 100%);
background-image: -webkit-linear-gradient( 90deg, #f8cb40 0%, #ffd143 100%);
background-image: -ms-linear-gradient( 90deg, #f8cb40 0%, #ffd143 100%);css init
body
{
font-family:"open-sans"!important;
font-size: 15px;
line-height: 15px;
position: relative;
-webkit-text-size-adjust: none;
height:100%;
background-color:#eeeeee;
}
charset "utf-8";
/* reset */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,textarea,p,blockquote,th,td,input,select,textarea,button {margin:0;padding:0}
fieldset,img {border:0 none}
dl,ul,ol,menu,li {list-style:none}
blockquote, q {quotes: none}
blockquote:before, blockquote:after,q:before, q:after {content:'';content:none}
input,select,textarea,button {vertical-align:middle}
button {border:0 none;background-color:transparent;cursor:pointer}
body {background:#fff}
body,th,td,input,select,textarea,button {font-size:12px;line-height:1 ;font-family:"微软雅黑", "黑体","宋体";color:#666}
a {color:#666;text-decoration:none}
a:active, a:hover {text-decoration:none}
address,caption,cite,code,dfn,em,var {font-style:normal;font-weight:normal}
caption {display:none;}
table {width:100%;border-collapse:collapse;border-spacing:0;table-layout:fixed;}
img{vertical-align:top}
a {outline: none;}
a:active {star:expression(this.onFocus=this.blur());}
/*
::selection {color: #fff;background-color: #4C6E78;}
::-moz-selection {color: #fff;background-color: #4C6E78;}
*/
/* BEGIN Light Italic */
font-face {
font-family: 'open-sans';
src: url("./fonts/LightItalic/OpenSans-LightItalic.eot?v=1.1.0");
src: url("./fonts/LightItalic/OpenSans-LightItalic.eot?#iefix&v=1.1.0") format("embedded-opentype"), url("./fonts/LightItalic/OpenSans-LightItalic.woff2?v=1.1.0") format("woff2"), url("./fonts/LightItalic/OpenSans-LightItalic.woff?v=1.1.0") format("woff"), url("./fonts/LightItalic/OpenSans-LightItalic.ttf?v=1.1.0") format("truetype"), url("./fonts/LightItalic/OpenSans-LightItalic.svg?v=1.1.0#LightItalic") format("svg");
font-weight: 300;
font-style: italic;
}
/* END Light Italic */
/* BEGIN Regular */
font-face {
font-family: 'open-sans';
src: url("./fonts/Regular/OpenSans-Regular.eot?v=1.1.0");
src: url("./fonts/Regular/OpenSans-Regular.eot?#iefix&v=1.1.0") format("embedded-opentype"), url("./fonts/Regular/OpenSans-Regular.woff2?v=1.1.0") format("woff2"), url("./fonts/Regular/OpenSans-Regular.woff?v=1.1.0") format("woff"), url("./fonts/Regular/OpenSans-Regular.ttf?v=1.1.0") format("truetype"), url("./fonts/Regular/OpenSans-Regular.svg?v=1.1.0#Regular") format("svg");
font-weight: normal;
font-style: normal;
}placeholder 属性是 HTML5 中的新属性。
css设置 placeholder 样式
.note textarea{
font-size:24px;
}
::-webkit-input-placeholder { /* WebKit browsers */
color: #ccc;
font-size:24px;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
color: #ccc;
font-size:24px;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
color: #ccc;
font-size:24px;
}
:-ms-input-placeholder { /* Internet Explorer 10+ */
color: #ccc;
font-size:24px;
}