小程序基础知识之 css 样式 media 标签深度详解教程

@media all {

        body{ font:12px; width:100%;}

   }

@media print

{

  body{ font:14px; width:595px;}  /* 用于打印时将宽度设置为595px(A4) */

}

@media all and (min-width: 1001px) {

 #sidebar ul li a:after {

  content: " (" attr(data-email) ")";

  font-size: 11px;

  font-style: italic;

  color: #666;

 }

}

@media all and (max-width: 1000px) and (min-width: 700px) {

 #sidebar ul li a:before {

  content: "Email: ";

  font-style: italic;

  color: #666;

 }

}

@media all and (max-width: 699px) and (min-width: 520px), (min-width: 1151px) {

 #sidebar ul li a {

  padding-left: 21px;

  background: url(../images/email.png) left center no-repeat;

 }

}

@media screen and (-webkit-min-device-pixel-ratio: 1.0), screen and (min--moz-device-pixel-ratio: 1.0), screen and (min-device-pixel-ratio: 1.0), screen and (min-resolution: 1.0dppx) {

  .icon-del {

background-image: url(../../resources/images/ui_3@2x.png);

background-size: 274px 228px;

display: block;

 }

}