NAVIGATION
[[NAV_ROW (CSS)]]
Differences
This shows you the differences between two versions of the page.
|
english:navigation:nav-row [2010/04/26 09:16] Knut Heermann (flip-flop) |
english:navigation:nav-row [2018/06/03 18:09] (current) |
||
|---|---|---|---|
| Line 5: | Line 5: | ||
| **{NAV_ROW[CURRENT|INT:0|1]}** | **{NAV_ROW[CURRENT|INT:0|1]}** | ||
| - | At this point I show a little CSS example of the navigation tag {NAV_ROW}. \\ | + | At this point I show you a little CSS example of the navigation tag {NAV_ROW}. \\ |
| - | For simple one-dimensional navigation systems without sub-levels, it is not necessary to resort to NAV_LIST_UL. | + | For simple one-dimensional navigation systems without sub-levels, it is not necessary to resort to [[english/navigation/nav_list_ul]]. The navigation [[http://www.phpwcms-docu.de/navigation_tags.phtml|NAV_ROW]] meets these requirements perfectly. |
| * **Horizontal one row navigation** | * **Horizontal one row navigation** | ||
| Line 120: | Line 120: | ||
| position: relative; /* IE6 */ | position: relative; /* IE6 */ | ||
| } | } | ||
| - | /* ==== End nav-row-horiz01 ====================================== */ | + | /* ==== End nav-row-horiz01 ===================================== */ |
| </code> | </code> | ||
| Line 202: | Line 202: | ||
| <code css|h nav-row-horiz03 |h> | <code css|h nav-row-horiz03 |h> | ||
| - | /* ====== nav-row-horiz03 ========================================= */ | + | /* ====== nav-row-horiz03 ======================================== */ |
| /* Wrapper around all // Umschlieszer gesamt */ | /* Wrapper around all // Umschlieszer gesamt */ | ||
| Line 254: | Line 254: | ||
| } | } | ||
| - | /* ==== End nav-row-horiz03 ====================================== */ | + | /* ==== End nav-row-horiz03 ===================================== */ |
| + | </code> | ||
| + | |||
| + | \\ | ||
| + | |||
| + | ===== CSS: Horizontal 04 ===== | ||
| + | |||
| + | {{:deutsch:navigationen:nav_row04_horizontal_img_1.gif|}} | ||
| + | |||
| + | File: **template/inc_css/nav_row_horiz04.css** | ||
| + | |||
| + | <code css|h nav-row-horiz04 |h> | ||
| + | /* ====== nav-row-horiz04 ======================================== */ | ||
| + | |||
| + | /* Wrapper around all // Umschlieszer gesamt */ | ||
| + | .nav-row-horiz-wrap { | ||
| + | background: #FFFFFF; | ||
| + | border: 1px solid #888; | ||
| + | height: 30px; | ||
| + | width: 540px; | ||
| + | margin: 0 0 0 320px; | ||
| + | padding: 6px 6px 0 6px; | ||
| + | } | ||
| + | |||
| + | .nav-row-horiz04 { | ||
| + | padding:0; | ||
| + | margin:0; | ||
| + | } | ||
| + | * html .nav-row-horiz04 { /* only IE6 */ | ||
| + | position: absolute; | ||
| + | } | ||
| + | |||
| + | /* Spacer // Zwischenraum */ | ||
| + | .nav-row-horiz04 .space { | ||
| + | float: left; | ||
| + | width: 1px; | ||
| + | height:10px; | ||
| + | } | ||
| + | |||
| + | /* Formatting a-tag // Formatierung des a-tags */ | ||
| + | .nav-row-horiz04 a, | ||
| + | .nav-row-horiz04 a:visited { | ||
| + | float: left; | ||
| + | border: 1px solid #888; | ||
| + | text-decoration:none; | ||
| + | font-size:14px; | ||
| + | color: #fff; | ||
| + | /* font-weight:bold; */ | ||
| + | padding: 2px 6px 3px 6px; | ||
| + | } | ||
| + | |||
| + | /* Formatting normal status a-tag // Formatierung normaler Status a-tags */ | ||
| + | .nav-row-horiz04 .normal a, | ||
| + | .nav-row-horiz04 .normal a:visited { | ||
| + | background: #808080; | ||
| + | text-decoration:none; | ||
| + | } | ||
| + | |||
| + | /* Formatting active status a-tag // Formatierung aktiver Status a-tags */ | ||
| + | .nav-row-horiz04 .aktiv a, | ||
| + | .nav-row-horiz04 .aktiv a:visited { | ||
| + | background: #FF6F00; | ||
| + | padding-bottom: 27px; | ||
| + | position: relative; /* IE6 */ | ||
| + | } | ||
| + | |||
| + | /* Formatting hover status a-tag // Formatierung hover Status a-tags */ | ||
| + | .nav-row-horiz04 .normal a:hover, | ||
| + | .nav-row-horiz04 .aktiv a:hover { | ||
| + | background: #C7A317; | ||
| + | padding-bottom: 27px; | ||
| + | color: #fff; /* IE6 */ | ||
| + | position: relative; /* IE6 */ | ||
| + | } | ||
| + | |||
| + | /* ==== End nav-row-horiz04 ===================================== */ | ||
| </code> | </code> | ||
| Line 268: | Line 343: | ||
| <code css|h nav-row-vert01 |h> | <code css|h nav-row-vert01 |h> | ||
| - | /* ====== nav-row-vert01 ==================================== */ | + | /* ====== nav-row-vert01 ========================================= */ |
| /* Wrapper around all // Umschlieszer gesamt */ | /* Wrapper around all // Umschlieszer gesamt */ | ||
| Line 317: | Line 392: | ||
| color: #fff; /* IE6 */ | color: #fff; /* IE6 */ | ||
| } | } | ||
| - | /* ==== End nav-row-vert01 ===================================== */ | + | /* ==== End nav-row-vert01 ====================================== */ |
| </code> | </code> | ||
| \\ | \\ | ||
