浏览代码

Docs: Improved legibility.

Mr.doob 8 年之前
父节点
当前提交
2a98f665dc

+ 71 - 71
docs/manual/introduction/How-to-run-thing-locally.html

@@ -40,64 +40,6 @@
 			</p>
 		</div>
 
-		<h2>Change local files security policy</h2>
-		<div>
-			<h4>Safari</h4>
-			<div>
-				<p>
-					Enable the develop menu using the preferences panel, under Advanced -&gt; "Show develop menu
-					in menu bar".
-				</p>
-
-				<p>
-					Then from the safari "Develop" menu, select "Disable local file restrictions", it is also
-					worth noting safari has some odd behaviour with caches, so it is advisable to use the
-					"Disable caches" option in the same menu; if you are editing &amp; debugging using safari.
-				</p>
-			</div>
-
-
-			<h4>Chrome</h4>
-			<div>
-				<p>Close all running Chrome instances first. The important word here is 'all'.</p>
-
-				<p>
-					On Windows, you may check for Chrome instances using the Windows Task Manager.
-					Alternatively, if you see a Chrome icon in the system tray, then you may open its context
-					menu and click 'Exit'. This should close all Chrome instances.
-				</p>
-
-				<p>Then start the Chrome executable with a command line flag:</p>
-
-				<code>chrome --allow-file-access-from-files</code>
-
-				<p>
-					On Windows, probably the easiest is probably to create a special shortcut icon which has
-					added the flag given above (right-click on shortcut -&gt; properties -&gt; target).
-				</p>
-
-				<p>On Mac OSX, you can do this with</p>
-
-				<code>open /Applications/Google\ Chrome.app --args --allow-file-access-from-files</code>
-			</div>
-
-			<h4>Firefox</h4>
-			<div>
-				<ol>
-				<li>
-					In the address bar, type <code>about:config</code>
-				</li>
-				<li>
-					Find the <code>security.fileuri.strict_origin_policy</code> parameter
-				</li>
-				<li>
-					Set it to <em>false</em>
-				</li>
-				</ol>
-			</div>
-
-		</div>
-
 
 		<h2>Run a local server</h2>
 		<div>
@@ -107,7 +49,16 @@
 				three.js application.
 			</p>
 
-			<h4>Running a Python server</h4>
+			<h3>Node.js server</h3>
+			<div>
+				<p>Node.js has a simple HTTP server package. To install:</p>
+				<code>npm install http-server -g</code>
+
+				<p>To run (from your local directory):</p>
+				<code>http-server . -p 8000</code>
+			</div>
+
+			<h3>Python server</h3>
 			<div>
 				<p>
 					If you have [link:http://python.org/ Python] installed, it should be enough to run this
@@ -126,7 +77,7 @@ python -m http.server
 				<code>http://localhost:8000/</code>
 			</div>
 
-			<h4>Running a Ruby server</h4>
+			<h3>Ruby server</h3>
 			<div>
 				<p>If you have Ruby installed, you can get the same result running this instead:</p>
 				<code>
@@ -134,22 +85,13 @@ ruby -r webrick -e "s = WEBrick::HTTPServer.new(:Port => 8000, :DocumentRoot =>
 				</code>
 			</div>
 
-			<h4>Running a PHP server</h4>
+			<h3>PHP server</h3>
 			<div>
 				<p>PHP also has a built-in web server, starting with php 5.4.0:</p>
 				<code>php -S localhost:8000</code>
 			</div>
 
-			<h4>Running a Node.js server</h4>
-			<div>
-				<p>Node.js has a simple HTTP server package. To install:</p>
-				<code>npm install http-server -g</code>
-
-				<p>To run (from your local directory):</p>
-				<code>http-server . -p 8000</code>
-			</div>
-
-			<h4>Running lighttpd on Mac</h4>
+			<h3>Lighttpd</h3>
 			<div>
 				<p>
 					Lighttpd is a very lightweight general purpose webserver. We'll cover installing it on OSX with
@@ -180,6 +122,64 @@ ruby -r webrick -e "s = WEBrick::HTTPServer.new(:Port => 8000, :DocumentRoot =>
 				</ol>
 			</div>
 
+		<h2>Change local files security policy</h2>
+		<div>
+			<h3>Safari</h3>
+			<div>
+				<p>
+					Enable the develop menu using the preferences panel, under Advanced -&gt; "Show develop menu
+					in menu bar".
+				</p>
+
+				<p>
+					Then from the safari "Develop" menu, select "Disable local file restrictions", it is also
+					worth noting safari has some odd behaviour with caches, so it is advisable to use the
+					"Disable caches" option in the same menu; if you are editing &amp; debugging using safari.
+				</p>
+			</div>
+
+
+			<h3>Chrome</h3>
+			<div>
+				<p>Close all running Chrome instances first. The important word here is 'all'.</p>
+
+				<p>
+					On Windows, you may check for Chrome instances using the Windows Task Manager.
+					Alternatively, if you see a Chrome icon in the system tray, then you may open its context
+					menu and click 'Exit'. This should close all Chrome instances.
+				</p>
+
+				<p>Then start the Chrome executable with a command line flag:</p>
+
+				<code>chrome --allow-file-access-from-files</code>
+
+				<p>
+					On Windows, probably the easiest is probably to create a special shortcut icon which has
+					added the flag given above (right-click on shortcut -&gt; properties -&gt; target).
+				</p>
+
+				<p>On Mac OSX, you can do this with</p>
+
+				<code>open /Applications/Google\ Chrome.app --args --allow-file-access-from-files</code>
+			</div>
+
+			<h3>Firefox</h3>
+			<div>
+				<ol>
+				<li>
+					In the address bar, type <code>about:config</code>
+				</li>
+				<li>
+					Find the <code>security.fileuri.strict_origin_policy</code> parameter
+				</li>
+				<li>
+					Set it to <em>false</em>
+				</li>
+				</ol>
+			</div>
+
+		</div>
+
 			<p>
 				Other simple alternatives are [link:http://stackoverflow.com/q/12905426/24874 discussed here]
 				on Stack Overflow.

+ 2 - 2
docs/manual/introduction/How-to-update-things.html

@@ -118,7 +118,7 @@ line.geometry.attributes.position.needsUpdate = true; // required after the firs
 					[link:http://jsfiddle.net/w67tzfhx/ Here is a fiddle] showing an animated line which you can adapt to your use case.
 				</p>
 
-				<h4>Examples:</h4>
+				<h3>Examples:</h3>
 					[example:webgl_custom_attributes WebGL / custom / attributes]<br />
 					[example:webgl_buffergeometry_custom_attributes_particles WebGL / buffergeometry / custom / attributes / particles]
 
@@ -155,7 +155,7 @@ geometry.tangentsNeedUpdate = true;
 		geometry.dynamic = true;
 				</code>
 
-				<h4>Example:</h4>
+				<h3>Examples:</h3>
 					[example:webgl_geometry_dynamic WebGL / geometry / dynamic]<br />
 			</div>
 

+ 3 - 3
docs/manual/introduction/Useful-links.html

@@ -31,7 +31,7 @@
 
 		<h2>Tutorials and courses</h2>
 
-		<h4>Getting started with three.js</h4>
+		<h3>Getting started with three.js</h3>
 		<ul>
 			<li>
 				[link:https://codepen.io/rachsmith/post/beginning-with-3d-webgl-pt-1-the-scene Beginning with 3D WebGL] by [link:https://codepen.io/rachsmith/ Rachel Smith].
@@ -41,7 +41,7 @@
 			</li>
 		</ul>
 
-		<h4>More extensive / advanced articles and courses</h4>
+		<h3>More extensive / advanced articles and courses</h3>
 		<ul>
 			<li>
 				[link:http://blog.cjgammon.com/ Collection of tutorials] by [link:http://www.cjgammon.com/ CJ Gammon].
@@ -65,7 +65,7 @@
 		 </li>
 		</ul>
 
-		<h4>Tutorials in other languages</h4>
+		<h3>Tutorials in other languages</h3>
 		<ul>
 			<li>
 				[link:http://www.natural-science.or.jp/article/20120220155529.php Building A Physics Simulation Environment] - three.js tutorial in Japanese