手机网站宽度自动适应手机屏幕-tutorial php-php.cn

其中：

width=device-width ：表示宽度是设备屏幕的宽度

initial-scale=1.0 ：表示初始的缩放比例

minimum-scale=0.5 ：表示最小的缩放比例

maximum-scale=2.0 ：表示最大的缩放比例

user-scalable=yes ：表示用户是否可以调整缩放比例

如果希望打开网页就自动以原始比例显示，不允许用户修改的话，则将以上代码修改为：

<div id="highlighter_472583" class="syntaxhighlighter " style="width:734.578px;font-size:14px;border:1px solid #E7E5DC;color:#494949;white-space:normal;margin:1em 0px !important;padding:1px !important;outline:0px !important;float:none !important;vertical-align:baseline !important;position:relative !important;left:auto !important;top:auto !important;right:auto !important;bottom:auto !important;height:auto !important;line-height:1.1em !important;font-family:Consolas, 'Bitstream Vera Sans Mono', 'Courier New', Courier, monospace !important;min-height:auto !important;background:none #FFFFFF !important;"> <div class="bar " style="margin:0px !important;padding:0px !important;outline:0px !important;float:none !important;vertical-align:baseline !important;position:static !important;left:auto !important;top:auto !important;right:auto !important;bottom:auto !important;height:auto !important;width:auto !important;line-height:1.1em !important;font-size:1em !important;min-height:auto !important;background:none !important;"> <div class="toolbar" style="margin:0px !important;padding:8px 8px 8px 0px !important;outline:0px !important;float:none !important;vertical-align:baseline !important;position:absolute !important;left:auto !important;top:0px !important;right:0px !important;bottom:auto !important;height:auto !important;width:auto !important;line-height:1.1em !important;font-size:1px !important;min-height:auto !important;border-color:#E7E5DC !important;border-style:solid !important;border-width:0px 0px 1px 1px !important;background:none #F8F8F8 !important;"> 查看代码 <div class="item copyToClipboard" style="margin:0px 0px 0px 8px !important;padding:0px !important;outline:0px !important;float:left !important;vertical-align:baseline !important;position:static !important;left:auto !important;top:auto !important;right:auto !important;bottom:auto !important;height:auto !important;width:auto !important;line-height:1.1em !important;font-size:1em !important;min-height:auto !important;overflow:visible !important;background:none !important;"> 打印 <div class="lines" style="margin:0px !important;padding:0px !important;outline:0px !important;float:none !important;vertical-align:baseline !important;position:static !important;left:auto !important;top:auto !important;right:auto !important;bottom:auto !important;height:auto !important;width:auto !important;line-height:1.1em !important;font-size:1em !important;min-height:auto !important;background:none !important;"> <div class="line alt1" style="margin:0px !important;padding:0px !important;outline:0px !important;float:none !important;vertical-align:baseline !important;position:static !important;left:auto !important;top:auto !important;right:auto !important;bottom:auto !important;height:auto !important;width:auto !important;line-height:1.1em !important;font-size:1em !important;min-height:auto !important;background-image:none !important;background-attachment:initial !important;background-size:initial !important;background-origin:initial !important;background-clip:initial !important;background-position:initial !important;background-repeat:initial !important;"> <table style="margin:0px !important;padding:0px !important;outline:0px !important;float:none !important;vertical-align:baseline !important;position:static !important;left:auto !important;top:auto !important;right:auto !important;bottom:auto !important;height:auto !important;width:auto !important;line-height:1.1em !important;font-size:1em !important;min-height:auto !important;background:none !important;"> <tbody style="margin:0px !important;padding:0px !important;outline:0px !important;float:none !important;vertical-align:baseline !important;position:static !important;left:auto !important;top:auto !important;right:auto !important;bottom:auto !important;height:auto !important;width:auto !important;line-height:1.1em !important;font-size:1em !important;min-height:auto !important;background:none !important;"> <tr style="margin:0px !important;padding:0px !important;outline:0px !important;float:none !important;vertical-align:baseline !important;position:static !important;left:auto !important;top:auto !important;right:auto !important;bottom:auto !important;height:auto !important;width:auto !important;line-height:1.1em !important;font-size:1em !important;min-height:auto !important;background:none !important;"> <td class="number" style="margin:0px !important;padding:0px !important;outline:0px !important;float:none !important;vertical-align:top !important;position:static !important;left:auto !important;top:auto !important;right:auto !important;bottom:auto !important;height:auto !important;width:3em !important;line-height:1.1em !important;font-family:Consolas, 'Bitstream Vera Sans Mono', 'Courier New', Courier, monospace !important;font-size:1em !important;min-height:auto !important;color:#AFAFAF !important;background:none !important;"> <code style="margin:0px !important;padding:0px 0.3em 0px 0px !important;outline:0px !important;text-align:right !important;float:none !important;vertical-align:baseline !important;position:static !important;left:auto !important;top:auto !important;right:auto !important;bottom:auto !important;height:auto !important;width:2.7em !important;line-height:1.1em !important;font-family:Consolas, 'Bitstream Vera Sans Mono', 'Courier New', Courier, monospace !important;font-size:1em !important;min-height:auto !important;display:block !important;background:none !important;">1 <td class="content" style="margin:0px !important;padding:0px 0px 0px 0.5em !important;outline:0px !important;float:none !important;vertical-align:top !important;position:static !important;left:auto !important;top:auto !important;right:auto !important;bottom:auto !important;height:auto !important;width:auto !important;line-height:1.1em !important;font-family:Consolas, 'Bitstream Vera Sans Mono', 'Courier New', Courier, monospace !important;font-size:1em !important;min-height:auto !important;border-left-width:3px !important;border-left-style:solid !important;border-left-color:#6CE26C !important;background:none !important;"> <code class="plain" style="margin:0px !important;padding:0px !important;outline:0px !important;float:none !important;vertical-align:baseline !important;position:static !important;left:auto !important;top:auto !important;right:auto !important;bottom:auto !important;height:auto !important;width:auto !important;line-height:1.1em !important;font-family:Consolas, 'Bitstream Vera Sans Mono', 'Courier New', Courier, monospace !important;font-size:1em !important;min-height:auto !important;background:none !important;"><code class="keyword" style="margin:0px !important;padding:0px !important;outline:0px !important;float:none !important;vertical-align:baseline !important;position:static !important;left:auto !important;top:auto !important;right:auto !important;bottom:auto !important;height:auto !important;width:auto !important;line-height:1.1em !important;font-family:Consolas, 'Bitstream Vera Sans Mono', 'Courier New', Courier, monospace !important;font-weight:bold !important;font-size:1em !important;min-height:auto !important;color:#006699 !important;background:none !important;">meta <code class="color1" style="margin:0px !important;padding:0px !important;outline:0px !important;float:none !important;vertical-align:baseline !important;position:static !important;left:auto !important;top:auto !important;right:auto !important;bottom:auto !important;height:auto !important;width:auto !important;line-height:1.1em !important;font-family:Consolas, 'Bitstream Vera Sans Mono', 'Courier New', Courier, monospace !important;font-size:1em !important;min-height:auto !important;color:#808080 !important;background:none !important;">name <code class="plain" style="margin:0px !important;padding:0px !important;outline:0px !important;float:none !important;vertical-align:baseline !important;position:static !important;left:auto !important;top:auto !important;right:auto !important;bottom:auto !important;height:auto !important;width:auto !important;line-height:1.1em !important;font-family:Consolas, 'Bitstream Vera Sans Mono', 'Courier New', Courier, monospace !important;font-size:1em !important;min-height:auto !important;background:none !important;">= <code class="string" style="margin:0px !important;padding:0px !important;outline:0px !important;float:none !important;vertical-align:baseline !important;position:static !important;left:auto !important;top:auto !important;right:auto !important;bottom:auto !important;height:auto !important;width:auto !important;line-height:1.1em !important;font-family:Consolas, 'Bitstream Vera Sans Mono', 'Courier New', Courier, monospace !important;font-size:1em !important;min-height:auto !important;color:blue !important;background:none !important;">"viewport" <code class="color1" style="margin:0px !important;padding:0px !important;outline:0px !important;float:none !important;vertical-align:baseline !important;position:static !important;left:auto !important;top:auto !important;right:auto !important;bottom:auto !important;height:auto !important;width:auto !important;line-height:1.1em !important;font-family:Consolas, 'Bitstream Vera Sans Mono', 'Courier New', Courier, monospace !important;font-size:1em !important;min-height:auto !important;color:#808080 !important;background:none !important;">content <code class="plain" style="margin:0px !important;padding:0px !important;outline:0px !important;float:none !important;vertical-align:baseline !important;position:static !important;left:auto !important;top:auto !important;right:auto !important;bottom:auto !important;height:auto !important;width:auto !important;line-height:1.1em !important;font-family:Consolas, 'Bitstream Vera Sans Mono', 'Courier New', Courier, monospace !important;font-size:1em !important;min-height:auto !important;background:none !important;">= <code class="string" style="margin:0px !important;padding:0px !important;outline:0px !important;float:none !important;vertical-align:baseline !important;position:static !important;left:auto !important;top:auto !important;right:auto !important;bottom:auto !important;height:auto !important;width:auto !important;line-height:1.1em !important;font-family:Consolas, 'Bitstream Vera Sans Mono', 'Courier New', Courier, monospace !important;font-size:1em !important;min-height:auto !important;color:blue !important;background:none !important;">"width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" <code class="plain" style="margin:0px !important;padding:0px !important;outline:0px !important;float:none !important;vertical-align:baseline !important;position:static !important;left:auto !important;top:auto !important;right:auto !important;bottom:auto !important;height:auto !important;width:auto !important;line-height:1.1em !important;font-family:Consolas, 'Bitstream Vera Sans Mono', 'Courier New', Courier, monospace !important;font-size:1em !important;min-height:auto !important;background:none !important;">/> 方法二：

把页面最顶部类似下面这段代码：

.......>

替换为：

<div id="highlighter_478916" class="syntaxhighlighter " style="width:734.578px;font-size:14px;border:1px solid #E7E5DC;color:#494949;white-space:normal;margin:1em 0px !important;padding:1px !important;outline:0px !important;float:none !important;vertical-align:baseline !important;position:relative !important;left:auto !important;top:auto !important;right:auto !important;bottom:auto !important;height:auto !important;line-height:1.1em !important;font-family:Consolas, 'Bitstream Vera Sans Mono', 'Courier New', Courier, monospace !important;min-height:auto !important;background:none #FFFFFF !important;"> <div class="bar show" style="margin:0px !important;padding:0px !important;outline:0px !important;float:none !important;vertical-align:baseline !important;position:static !important;left:auto !important;top:auto !important;right:auto !important;bottom:auto !important;height:auto !important;width:auto !important;line-height:1.1em !important;font-size:1em !important;min-height:auto !important;background:none !important;"> <div class="toolbar" style="margin:0px !important;padding:8px 8px 8px 0px !important;outline:0px !important;float:none !important;vertical-align:baseline !important;position:absolute !important;left:auto !important;top:0px !important;right:0px !important;bottom:auto !important;height:auto !important;width:auto !important;line-height:1.1em !important;font-size:1px !important;min-height:auto !important;border-color:#E7E5DC !important;border-style:solid !important;border-width:0px 0px 1px 1px !important;background:none #F8F8F8 !important;"> 查看代码 <div class="item copyToClipboard" style="margin:0px 0px 0px 8px !important;padding:0px !important;outline:0px !important;float:left !important;vertical-align:baseline !important;position:static !important;left:auto !important;top:auto !important;right:auto !important;bottom:auto !important;height:auto !important;width:auto !important;line-height:1.1em !important;font-size:1em !important;min-height:auto !important;overflow:visible !important;background:none !important;"> 打印 <div class="lines" style="margin:0px !important;padding:0px !important;outline:0px !important;float:none !important;vertical-align:baseline !important;position:static !important;left:auto !important;top:auto !important;right:auto !important;bottom:auto !important;height:auto !important;width:auto !important;line-height:1.1em !important;font-size:1em !important;min-height:auto !important;background:none !important;"> <div class="line alt1" style="margin:0px !important;padding:0px !important;outline:0px !important;float:none !important;vertical-align:baseline !important;position:static !important;left:auto !important;top:auto !important;right:auto !important;bottom:auto !important;height:auto !important;width:auto !important;line-height:1.1em !important;font-size:1em !important;min-height:auto !important;background-image:none !important;background-attachment:initial !important;background-size:initial !important;background-origin:initial !important;background-clip:initial !important;background-position:initial !important;background-repeat:initial !important;"> <table style="margin:0px !important;padding:0px !important;outline:0px !important;float:none !important;vertical-align:baseline !important;position:static !important;left:auto !important;top:auto !important;right:auto !important;bottom:auto !important;height:auto !important;width:auto !important;line-height:1.1em !important;font-size:1em !important;min-height:auto !important;background:none !important;"> <tbody style="margin:0px !important;padding:0px !important;outline:0px !important;float:none !important;vertical-align:baseline !important;position:static !important;left:auto !important;top:auto !important;right:auto !important;bottom:auto !important;height:auto !important;width:auto !important;line-height:1.1em !important;font-size:1em !important;min-height:auto !important;background:none !important;"> <tr style="margin:0px !important;padding:0px !important;outline:0px !important;float:none !important;vertical-align:baseline !important;position:static !important;left:auto !important;top:auto !important;right:auto !important;bottom:auto !important;height:auto !important;width:auto !important;line-height:1.1em !important;font-size:1em !important;min-height:auto !important;background:none !important;"> <td class="number" style="margin:0px !important;padding:0px !important;outline:0px !important;float:none !important;vertical-align:top !important;position:static !important;left:auto !important;top:auto !important;right:auto !important;bottom:auto !important;height:auto !important;width:3em !important;line-height:1.1em !important;font-family:Consolas, 'Bitstream Vera Sans Mono', 'Courier New', Courier, monospace !important;font-size:1em !important;min-height:auto !important;color:#AFAFAF !important;background:none !important;"> <code style="margin:0px !important;padding:0px 0.3em 0px 0px !important;outline:0px !important;text-align:right !important;float:none !important;vertical-align:baseline !important;position:static !important;left:auto !important;top:auto !important;right:auto !important;bottom:auto !important;height:auto !important;width:2.7em !important;line-height:1.1em !important;font-family:Consolas, 'Bitstream Vera Sans Mono', 'Courier New', Courier, monospace !important;font-size:1em !important;min-height:auto !important;display:block !important;background:none !important;">1 <td class="content" style="margin:0px !important;padding:0px 0px 0px 0.5em !important;outline:0px !important;float:none !important;vertical-align:top !important;position:static !important;left:auto !important;top:auto !important;right:auto !important;bottom:auto !important;height:auto !important;width:auto !important;line-height:1.1em !important;font-family:Consolas, 'Bitstream Vera Sans Mono', 'Courier New', Courier, monospace !important;font-size:1em !important;min-height:auto !important;border-left-width:3px !important;border-left-style:solid !important;border-left-color:#6CE26C !important;background:none !important;"> <code class="plain" style="margin:0px !important;padding:0px !important;outline:0px !important;float:none !important;vertical-align:baseline !important;position:static !important;left:auto !important;top:auto !important;right:auto !important;bottom:auto !important;height:auto !important;width:auto !important;line-height:1.1em !important;font-family:Consolas, 'Bitstream Vera Sans Mono', 'Courier New', Courier, monospace !important;font-size:1em !important;min-height:auto !important;background:none !important;">ttp://www.wapforum.org/DTD/xhtml-mobile10.dtd" style="color:#FF0000;">http://www.wapforum.org/DTD/xhtml-mobile10.dtd">