最近几年来，地理信息系统无论是在理论上还是应用上都处在一个飞速发展的阶段。 GIS被应用于多个领域的建模和决策支持，如城市管理、区划、环境整治等等，地理信息成为信息时代重要的组成部分之一； “数字地球”概念的提出，更进一步推动了作为其技术支撑的GIS的发展。 与此同时，一些学者致力于相关的理论研究，如空间感知、空间数据误差、空间关系的形式化等等。 这恰好说明了地理信息系统作为应用技术和学科的两个方面，并且这两个方面构成了相互促进的发展过程。
8.39.1. Foundation default settin ¶
Foundation uses browser default font size ( font-size:100% ). For browsers on most desktop devices, the font size defaults to 16px. For browsers on mobile devices, the default font size is 12px. The default font is "Helvetica Neue" , line-height defaults to 1.5 .
These settings apply to the The element within the element.
In addition The outer margin (margin-bottom) between the element and the bottom is 1.25rem, and the line-height is 1.6.
8.39.2. Text ¶
The following HTML element, which is rendered in a separate style by Foundation, does not use the browser default style. Click “try” to view an online example.
element | Description | Online instance |
|---|---|---|
< H1 >-< h6 > | H1-H6 title | |
< a > | Light blue link, move the mouse to the link will be underlined | |
< small > | Light gray subtitle text | |
< blockquote > | Reference content module | |
< strong > | Bold text | |
< em > | Italic | |
< abbr > | Specify the abbreviation of the word, the text of this element is dotted and underlined, and there is a prompt when the mouse moves up. | |
< kbd > | Receive keyboard input instructions:? CTRL + P | |
< hr > | Horizontal line | |
< code > | Code snippet | |
< ul > | Unordered list | |
< ol > | Ordered list | |
< dl > | Descriptive list |
8.39.3. Text alignment ¶
Use the CSS class to modify the alignment of the text:
. text-left | Left align text | |
|---|---|---|
. text-right | Align text to the right | |
. text-center | In the middle | |
. text-justify | Alignment at both ends |
8.39.4. Alignment of screens of different sizes ¶
Use the CSS class to modify the alignment of different-sized screens of text:
Class | Description | Example |
|---|---|---|
Align left | ||
.small-text-left | Align all sizes to the left of the screen | |
.small-only-text-left | Small screen left alignment (width less than 40em) | |
.medium-text-left | The width is larger than the 40.0625em size and the screen is left aligned. | |
.medium-only-text-left | The width is aligned to the left of the screen in 40.0625em to 64em sizes | |
.large-text-left | The width is larger than the 64.0625em size and the screen is left aligned. | |
.large-only-text-left | The width is aligned to the left of the screen in 64.0625em to 90em sizes | |
.xlarge-text-left | The width is larger than the 90.0625em size and the screen is left aligned. | |
.xlarge-only-text-left | The width is aligned to the left of the screen in 90.0625em to 120em sizes | |
.xxlarge-text-left | The width is larger than the 120em size and the screen is left aligned. | |
Align right | ||
.small-text-right | Align all sizes to the right of the screen | |
.small-only-text-right | Small screen right alignment (width less than 40em) | |
.medium-text-right | The width is larger than the 40.0625em size and the screen is right-aligned. | |
.medium-only-text-right | The width is aligned to the right of the screen in 40.0625em to 64em sizes | |
.large-text-right | The width is larger than the 64.0625em size and the screen is right-aligned. | |
.large-only-text-right | The width is aligned to the right of the screen in 64.0625em to 90em sizes | |
.xlarge-text-right | The width is larger than the 90.0625em size and the screen is right-aligned. | |
.xlarge-only-text-right | The width is aligned to the right of the screen in 90.0625em to 120em sizes | |
.xxlarge-text-right | The width is larger than the 120em size and the screen is right-aligned. | |
Center alignment | ||
.small-text-center | The screen of all dimensions is centered. | |
.small-only-text-center | Small screen center alignment (width less than 40em) | |
.medium-text-center | The width is larger than the 40.0625em size and the screen is centered. | |
.medium-only-text-center | The width is centered on the screen from 40.0625em to 64em. | |
.large-text-center | The width is larger than the 64.0625em size and the screen is centered. | |
.large-only-text-center | The width is centered on the screen from 64.0625em to 90em. | |
.xlarge-text-center | The width is larger than the 90.0625em size and the screen is centered. | |
.xlarge-only-text-center | The width is centered on the screen from 90.0625em to 120em. | |
.xxlarge-text-center | The width is larger than the 120em size and the screen is centered. | |
Alignment at both ends | ||
.small-text-justify | The screens of all sizes are aligned at both ends | |
.small-only-text-justify | Small screen alignment at both ends (width less than 40em) | |
.medium-text-justify | The width is larger than the 40.0625em size and the two ends of the screen are aligned. | |
.medium-only-text-justify | The width is aligned at both ends of the 40.0625em to 64em size screen | |
.large-text-justify | The width is larger than the 64.0625em size and the two ends of the screen are aligned. | |
.large-only-text-justify | The width is aligned at both ends of the 64.0625em to 90em size screen | |
.xlarge-text-justify | The width is larger than the 90.0625em size and the two ends of the screen are aligned. | |
.xlarge-only-text-justify | The width is aligned at both ends of the 90.0625em to 120em size screen | |
.xxlarge-text-justify | The width is larger than the 120em size and the two ends of the screen are aligned. |
8.39.5. Other ¶
Class | Description | Example |
|---|---|---|
.left | Element floats to the left | |
.right | Elements float to the right | |
.clearfix | Clear float-must be added to the parent element of the floating element | |
.hide | Hidden element (CSS?display: none) | |
. list-inline | Set all elements on the same line | |
.lead | Make the < p > element more prominent | |
.subheader | Set the light color < H1 >-< h6 > element |