HTML+CSS PC端 手机端 公用部分样式代码整理

1、css常用公用部分样式代码整理:

[html]  view plain  copy

1. body, html, div, blockquote, img, label, p, h1, h2, h3, h4, h5, h6, pre, ul, ol,  
2. li, dl, dt, dd, form, a, fieldset, input, th, td  
3. {margin: 0; padding: 0; border: 0; outline: none;}  
4. ul, ol{list-style: none;}  
5. a{color: black;text-decoration: none;}  
6. a:hover {text-decoration: underline;}  
7. html{font-size: 10px;font-family: "Microsoft YaHei",Arial;}  

[html]  view plain  copy

1. /*  

[html]  view plain  copy

1. 任意浏览器的默认字体高都是16px。所有未经调整的浏览器都符合: 1em=16px。那么12px=0.75em,10px=0.625em。为了简化font-size的换算，需要在css中的body选择器中声明Font-size=62.5%，这就使em值变为 16px*62.5%=10px, 这样12px=1.2em, 10px=1em, 也就是说只需要将你的原来的px数值除以10，然后换上em作为单位就行了。  

[html]  view plain  copy

1. */  

2、手机APP常用部分样式代码整理：

[html]  view plain  copy

1.     <!-- UC强制全屏 -->  
2.     <meta name="full-screen" content="yes" />  
3.     <!-- QQ强制全屏 -->  
4.     <meta name="x5-fullscreen" content="true" />  
5.     <!-- UC应用模式 -->  
6.     <meta name="browsermode" content="application" />  
7.     <!-- QQ应用模式 -->  
8.     <meta name="x5-page-mode" content="app" />  
9.   
10.   
11.   
12. <pre name="code" class="html"><!-- <span style="font-family: Arial, Helvetica, sans-serif;">屏幕自适应 高度</span> -->  

<meta name="viewport" content="width=device-width, initial-scale=1" />

[html]  view plain  copy

1. <!-- <span style="font-family: Arial, Helvetica, sans-serif;">js禁止手机浏览器里双击放大页面的功能？</span><span style="font-family: Arial, Helvetica, sans-serif;">--></span>  

<meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" name="viewport" />

[html]  view plain  copy

1.   

[html]  view plain  copy

1. <link rel="stylesheet" media="screen and (min-width:950px) and (max-width:1920px)" href="css/web.css" ><!-- web样式调用 -->  
2. <link rel="stylesheet" name="viewport" media="only screen and (max-device-width:640px)" href="css/phone640.css" ><!-- 手机屏幕640px时调用 -->  

版权声明：本文转自http://blog.csdn.net/MR_eason/article/details/52127308