最近几年来，地理信息系统无论是在理论上还是应用上都处在一个飞速发展的阶段。 GIS被应用于多个领域的建模和决策支持，如城市管理、区划、环境整治等等，地理信息成为信息时代重要的组成部分之一； “数字地球”概念的提出，更进一步推动了作为其技术支撑的GIS的发展。 与此同时，一些学者致力于相关的理论研究，如空间感知、空间数据误差、空间关系的形式化等等。 这恰好说明了地理信息系统作为应用技术和学科的两个方面，并且这两个方面构成了相互促进的发展过程。
The Foundation drop-down menu allows the user to select a value from a predefined drop-down list: 尝试一下 » Using buttons or links id The value needs to match the contents of the drop-down menu (id01). In < div >, < nav > Finally, initialize the Foundation JS. 注意: On the small screen, the width of all drop-down menus is 100%. 使用 注意: On the small screen, the width of all drop-down menus is 100%. Can be used < div > add multimedia elements to the drop-down menu: By default, the drop-down menu is at the bottom, and you can add By default, the drop-down menu is displayed after the button is clicked. If you need to display after the mouse is moved up, you can use it on the button We can add it to the button 8.13.1. Example ¶
Case analysis ¶
.dropdown Class to add a downward arrow symbol icon to the button. data-dropdown="id" Property to open the drop-down menu. Add in
.f-dropdown Class and data-dropdown-content Property to create the contents of the drop-down menu. Drop-down menu size ¶
.tiny , .small , .medium , .large 或 .mega 来修改下拉菜单的宽度。 8.13.2. Example ¶
..
..
..
..
Drop-down menu margin ¶
.content Class to add an inner margin to the drop-down menu 8.13.3. Example ¶
..
..
Other instances ¶
8.13.4. Example ¶
<a href="#" data-dropdown="id01" class="button dropdown">Dropdown Buttona> <div id="id01" data-dropdown-content class="f-dropdown medium content"> <h4>Paris Titleh4> <p>Some text.. some text..p> <img src="paris.jpg" alt="Paris" width="400" height="300"> <p>Paris, je t'aime. div>
Drop-down menu direction ¶
data-options="align:left|right|top" To change its orientation: 8.13.5. Example ¶
<a href="#" data-dropdown="id01" data-options="align:right" class="button dropdown">Righta> <a href="#" data-dropdown="id02" data-options="align:top" class="button dropdown">Top <a href="#" data-dropdown="id03" data-options="align:bottom" class="button dropdown">Bottoma> <a href="#" data-dropdown="id04" data-options="align:left" class="button dropdown">Left
Pull-down menu trigger condition ¶
data-options="is_hover:true" Attributes: 8.13.6. Example ¶
<a href="#" data-dropdown="id01" data-options="is_hover:true" class="button dropdown">Hover over mea> <ul id="id01" data-dropdown-content class="f-dropdown"> <li><a href="#">Link 1a>li> <li><a href="#">Link 2a>li> <li><a href="#">Link 3a>li> ul>
Split button ¶
.split Class to set a split effect button, which generates a downward icon button on the < span > element: 8.13.7. Example ¶