最近几年来，地理信息系统无论是在理论上还是应用上都处在一个飞速发展的阶段。 GIS被应用于多个领域的建模和决策支持，如城市管理、区划、环境整治等等，地理信息成为信息时代重要的组成部分之一； “数字地球”概念的提出，更进一步推动了作为其技术支撑的GIS的发展。 与此同时，一些学者致力于相关的理论研究，如空间感知、空间数据误差、空间关系的形式化等等。 这恰好说明了地理信息系统作为应用技术和学科的两个方面，并且这两个方面构成了相互促进的发展过程。
7.8.1. Rounded corner picture ¶
.rounded class allows the picture to show a fillet effect:Example ¶
<img src="cinqueterre.jpg" class="rounded" alt="Cinque Terre">
7.8.2. Ellipse picture ¶
.rounded-circle class can set an oval picture:Example ¶
<img src="cinqueterre.jpg" class="rounded-circle" alt="Cinque Terre">
7.8.3. Thumbnail image ¶
.img-thumbnail class is used to set the picture thumbnail (the picture has a frame):Example ¶
<img src="cinqueterre.jpg" class="img-thumbnail" alt="Cinque Terre">
7.8.4. Picture alignment ¶
Use .float-start class to set the left alignment of the picture, using the .float-end class sets the right alignment of the picture:Example ¶
<img src="paris.jpg" class="float-start"> <img src="cinqueterre.jpg" class="float-end">
7.8.5. The picture is centered ¶
Use .mx-auto (margin:auto) and .d-block (display:block) class to set the picture center alignment:Example ¶
<img src="paris.jpg" class="mx-auto d-block">
7.8.6. Responsive picture ¶
Images come in a variety of sizes and we need to adapt automatically according to the size of the screen.
We can pass through the add to label
.img-fluid class to setup responsive pictures.
.img-fluid class is set max-width: 100%; 、 height: auto; :Example ¶
<img class="img-fluid" src="img_chania.jpg" alt="Chania">