--=REKLAMA=--

Beez/obszar left menu

Z Joomla!WikiPL

Odwołania w HTML

Lewy pasek osadzony jest za pomocą elementu div oznaczonego identyfikatorem #left w obszarze #contentarea2, gdy widoczny jest prawy pasek lub #contentarea, gdy prawy pasek jest niewidoczny:

  1.    <a name="mainmenu"></a>
  2.    <div id="left">
  3.       <jdoc:include type="modules" name="left" style="beezDivision" headerLevel="3" />
  4.    </div><!-- left -->


Odwołania w CSS

#left

Poniższe klasy i identyfikatory wpływają na cały obszar div zawierający treści lewego paska. Zwróć uwagę na kolejność. Każdy atrybut CSS zostanie nadpisany przez powyższą klasę.

Style podstawowe

Miejsce przechowywania - plik: position.css

  1. #left ul {
  2. list-style-type:none;
  3. margin:0 0 20px 10px;
  4. }
  5.  
  6.  
  7. #left ul li {
  8. border:solid 1px #fff;
  9. margin:0 0 2px;
  10. }
  11.  
  12. #left ul li a {
  13. display:block;
  14. padding:3px 4px 3px 10px;
  15. text-decoration:none;
  16. }
  17.  
  18. #left ul li a:link,#left ul li a:visited {
  19. background:#F2E3ED;
  20. border-bottom:solid 1px #E0C1E0;
  21. color:#000;
  22. font-weight:normal;
  23. }
  24.  
  25. #left ul li a:hover,#left ul li a:active,#left ul li a:focus {
  26. background:#333 !important;
  27. color:#fff !important;
  28. }
  29.  
  30. /* ################## Main Menue ################## */
  31.  
  32. #left ul li ul {
  33. background:#fff;
  34. border:solid 1px #E0C1E0;
  35. border-bottom:solid 0 #93246F;
  36. border-left:solid 4px #93246F;
  37. border-top:0;
  38. margin:0;
  39. }
  40.  
  41. #left ul li ul li {
  42. border:solid 1px #fff;
  43. }
  44.  
  45. #left ul li ul li {
  46. margin:0;
  47. }
  48.  
  49. #left ul li ul li a:hover,#left ul li ul li a:active,#left ul li ul li a:focus {
  50. background:#93246F;
  51. color:#fff;
  52. }
  53.  
  54. #left ul li ul li ul {
  55. border:solid 0 #E0C1E0;
  56. padding:10px 0 10px 5px;
  57. }
  58.  
  59. #left ul li.active a:link,#left ul li.active a:visited {
  60. background:#93246F;
  61. border-left:solid 4px #BE7CA9;
  62. color:#fff;
  63. border-bottom:solid 1px #93246F;
  64. padding:3px 0 3px 6px;
  65. }
  66.  
  67. #left ul li.active ul li a:link,#left ul li.active ul li a:visited {
  68. background:#fff;
  69. border-bottom:solid 1px #E0C1E0;
  70. border-left:solid 0 #DD75BB;
  71. color:#000;
  72. font-weight:normal;
  73. padding:3px 4px 3px 20px;
  74. }
  75.  
  76. #left ul li.active ul li ul li a:link,#left ul li.active ul li ul li a:visited {
  77. background:#fff;
  78. border-bottom:solid 1px #E0C1E0;
  79. color:#000;
  80. font-weight:normal;
  81. margin:0 0 0 10px;
  82. }
  83.  
  84. #left ul li.active ul li.active a:link,#left ul li.active ul li.active a:visited {
  85. background:#fff;
  86. border-left:solid 0 #DD75BB;
  87. color:#000;
  88. font-weight:bold;
  89. }
  90.  
  91. #left ul li.active ul li.active ul li a:link,#left ul li.active ul li.active ul li a:visited {
  92. background:url(../images/arrow.gif) #fff no-repeat top left;
  93. color:#000;
  94. font-weight:normal;
  95. margin:0 0 0 15px;
  96. padding:3px 0 3px 15px;
  97. }
  98.  
  99. #left ul li.active ul li.active ul li.active span.active_link {
  100. background:url(../images/arrow.gif) #fff no-repeat top left;
  101. border-bottom:solid 1px #E0C1E0;
  102. color:#000;
  103. font-weight:bold;
  104. margin:0 0 0 15px;
  105. padding:3px 0 3px 15px;
  106. }

Pozostałe style

Miejsce przechowywania: position.css

  1. *
  2. {
  3.     margin: 0;
  4.     padding: 0;
  5. }
Dodatkowe informacje: position.css/*

Style dziedziczone

Miejsce przechowywania - plik: position.css

  1. #all
  2. {
  3.    background: #FFFFFF;
  4.    border: solid 1px #DBB0CD;
  5.    color: #000000;
  6.    font-size: 0.8em;
  7.    margin: 0 auto;
  8.    max-width: 1000px;
  9.    padding: 0 3px 3px 3px;
  10.    text-align: left;
  11. }

Dziedziczone są własności: color, font-size i text-align.

Miejsce przechowywania - plik: position.css

  1. body
  2. {
  3.    background: #F2E3ED;
  4.    color: #000000;
  5.    font-family: arial, helvetica, sans-serif;
  6.    font-size: 100.1%;
  7.    padding: 0px;
  8.    text-align: center;
  9. }

Dziedziczone jest własność font-family.


Dziękujemy za wkład

» Stefan Wajda [zwiastun],