最近几年来，地理信息系统无论是在理论上还是应用上都处在一个飞速发展的阶段。 GIS被应用于多个领域的建模和决策支持，如城市管理、区划、环境整治等等，地理信息成为信息时代重要的组成部分之一； “数字地球”概念的提出，更进一步推动了作为其技术支撑的GIS的发展。 与此同时，一些学者致力于相关的理论研究，如空间感知、空间数据误差、空间关系的形式化等等。 这恰好说明了地理信息系统作为应用技术和学科的两个方面，并且这两个方面构成了相互促进的发展过程。
Font Awesome is an excellent set of icon font library and CSS framework.
Font Awesome fonts provide you with scalable vector icons that can be customized for size, color, shadow, and any style that can be used with CSS.
To use the Font Awesome icon, please recommend CDN in 1. Domestic HTML page:
<linkrel="stylesheet"href="https://cdn.staticfile.org/font-awesome/4.7.0/css/font-awesome.css"> 2.Overseas recommended CDN
<linkrel="stylesheet"href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"> 3.Download directly to the local
Note: it is not recommended to download and install, just reference the CDN file directly in the html document header.
Note: this tutorial uses version 4.7.0.
You can use the prefix Font Awesome is designed to be used with inline elements. Also note that if you change the font size or color of the icon container, the icon will change. Fa-lg (33% increase), fa-2x,fa-3x, fa-4x, or fa-5x classes are used to increase the size of icons relative to their containers. Tip: if your icon is cut off at the top and bottom, please increase the lineheight. Results: List icons List icons List icons Results: Note: IE8 and IE9 do not support CSS3 animation. To stack multiple icons, use the Results: fa and the name of the icon to place the Font Awesome icon. 10.1.1. Example ¶
and elements are widely used in icons. Large icon ¶
10.1.2. Example ¶
List icon ¶
fa-ul and fa-li class is used to replace the default prefix in the unordered list. 10.1.3. Example ¶
<ulclass="fa-ul"><li><iclass="fa-li fa fa-check-square">i>List iconsli><li><iclass="fa-li fa fa-spinner fa-spin">i>List iconsli><li><iclass="fa-li fa fa-square">i>List iconsli>ul>
Boundaries and pulled icons ¶
fa-border ， fa-pull-right , or fa full left classes are used for pull referencing or article icons. 10.1.4. Example ¶
Rookie Tutorial -- Learning Not Only Techniques, But Dreams！！！
Rookie Tutorial -- Learning Not Only Techniques, But Dreams！！！
Rookie Tutorial -- Learning Not Only Techniques, But Dreams！！！ Rookie Tutorial - Learning Not Only Techniques, But Dreams！！！ Rookie Tutorial - Learning Not Only Techniques, But Dreams！！！ Rookie Tutorial - Learning Not Only Techniques, But Dreams！！！ Rookie Tutorial - Learning Not Only Techniques, But Dreams！！！
Dynamic icon ¶
fa-spin class can make the icon rotate fa-pulse class allows you torotate the icon in an 8-step cycle. 10.1.5. Example ¶
<iclass="fa fa-spinner fa-spin">i><iclass="fa fa-circle-o-notch fa-spin">
Rotate and flip icons ¶
fa-rotate-\* and fa-flip-\* class is used to rotate and flip icons. 10.1.6. Example ¶
<iclass="fa fa-shield">i><iclass="fa fa-shield fa-rotate-90">
Stacked icons ¶
fa-stack class fa-stack-1x class for normal-sized icons fa-stack-2x for larger icons. fa-inverse class can be used as an alternative icon color. You can also add larger icon classes to the parent to further control the size. 10.1.7. Example ¶
<spanclass="fa-stack fa-lg"><iclass="fa fa-circle-thin fa-stack-2x">
fa-twitter on fa-circle-thin fa-twitter (inverse) on fa-circle fa-ban on fa-camera
Fixed width icon ¶
fa-fw class is used to set a fixed-width icon. This class is useful whendifferent icon widths deviate from alignment. Especially suitable for Bootstrap navigation lists and list groups. 10.1.8. Example ¶
<divclass="list-group"><ahref="#"class="list-group-item"><iclass="fa fa-home fa-fw">Home