Parzyste i nie parzyste wpisy


(Darom82) #1

Czy ktos moze wie jak w css strony zrobic cos takiego, zeby kazda tresc strony byla na innym tle ? Przykladowo jedna tresc jest na tle koloru szarego a druga na tle koloru bialego, a trzecia znow na tle koloru szarego. Tak jak jest to widoczne np. Tutaj albo tez na mojej stronie w ksiedze gosci, gdzie sa widoczne tez male odstepy pomiedzy wpisami. Jak takie cos uzyskac zebym takie cos mial tutaj:

http://www.history.is.net.pl/?faq


(Sawyer47) #2

Jedna z możliwości to: http://www.tlumaczenia-angielski.info/w ... enodd.html


(Darom82) #3

A ja np. w pliku ksiegi gosci, gdzie tez mam to zastosowane mam taki kod:

#mbook .wpis{

  background:#7093DB;

  margin:5px auto;

  padding:5px;

  position:relative;

  overflow:hidden;

}

Tylko ze u mnie na stronce w tym miejscu co ja chce to nie dziala. Mozeci mi jakos pomoc ?


(Damgora) #4

jest kilka opcji:

  1. [*:3b4v48t3]pseudoklasa :nth-child() w CSS3 (czyli to o czym pisał nr47 )
    więcej[*:3b4v48t3]w kodzie generowanym po stronie serwera możesz łatwo dodać do parzystych elementów inną/dodatkową klasę[*:3b4v48t3]możesz modyfikować style przy pomocy JS

Póki CSS3 nie jest jeszcze w pełni wspierany przez wszystkie przeglądarki najlepsza wydaje mi się 2. opcja.


(Darom82) #5

(-Puma-) #6

Bez php lub JS tego nie zrobisz.

<?php

for($x=1; $x<=10; $x++) {

$y++;

if ($y==1) { echo '

czerwony'; } else { echo '

niebieski'; $y=0; } } ?>

http://webhosting.pl/Jak.zrobic.tabele. ... ..zebre%29


(Damgora) #7

(Darom82) #8

cayman3_11 Twoj sposob nie dziala, poniewaz na bialym pustym tle wyswietla sie tylko to:

treść

treść

treść

treść

treść

treść

treść

treść

treść

treść

treść

treść

treść

treść

treść

treść

treść

treść

treść

treść

Tak chyba nie powinno byc, wiec jak zrobic tak jak jest Tutaj to zrobione ?


(-Puma-) #9

Darom82, kod podany przez cayman3_11 działa dobrze... zapominasz o prawidłowym wstawieniu stylów :wink:

http://www.kurshtml.boo.pl/css/wstawianie.html


(Darom82) #10

Puma dobrze wstawilem styl, dziala faktycznie. Tylko co zrobic, zeby pomiedzy tymi wpisami byly odstepy ?


(-Puma-) #11

Można dopisać w css:

ul#lista li { margin:10px 0; }

(Darom82) #12

Probowalem to wlasnie zrobic na mojej stronie w tym miejscu http://www.history.is.net.pl/?faq

Ale tak jak podal rozwiazanie cayman3_11 to sie nie da poniewaz, nawet zmieniajac liczbe w tym kodzie z 20 na 1 to rozwala mi strone cala i niema tak jak chce zeby bylo.

Bo chce zeby ponizsza czesc tekstu byla na tle niebieskim takim zeby sie odroznial od tla calej strony:

? Początkujący webmaster

  Podstawowe zagadnienia związane z PHP, HTML'em i innymi technologiami internetowymi.

Od tego lekki odstep i znow na ponizszy teskt zeby byl na tle niebieskim, ktory bedzie sie odroznial od tla pierwszego wpisu i od tla calej strony.

? Modyfikacje

  Problemy z modyfikacjami.

I znowu ten sam kolor tla dla ponizszego wpisu, ktory jest w pierwszym wpisie

? Problemy w użytkowaniu

  Najczęściej pojawiające sie problemy podczas użytkowania naszej strony.

I tak zeby bylo na przemiennie kiedy dodam kolejne wpisy cos tak, jak to jest zrobione tutaj: http://www.phpbbhelp.pl/download.php?cat=31Jak to zrobic poprawnie ? :frowning: Tu mam kod moich wpisow:

znak_zap


(Damgora) #13

(Darom82) #14

Moze mi ktos pomoc to zrobic ?, bo nie moge sobie z tym poradzic.


(Damgora) #15

jak wygląda kod php (jeśli taki jest) odpowiedzialny za ten fragment:


(Darom82) #16

cayman3_11 caly kod php wyglada tak: faq.php

<?PHP if(!isset($_GET['cat']) && !is_numeric($_GET['faqid']) ){ ?>
» Faq

znak_zap


(Damgora) #17

no to ja to widzę tak:

  • Początkujący webmasterPodstawowe zagadnienia związane z PHP, HTML'em i innymi technologiami internetowymi.
  • ModyfikacjeProblemy z modyfikacjami.
  • Problemy w użytkowaniuNajczęściej pojawiające sie problemy podczas użytkowania naszej strony.
    [/code]
    [code]ul#linki{ color: #333333; list-style-image:url('/images/znak_zap.gif'); list-style-position:inside; margin:0; padding:0; } ul#linki li{ margin-bottom:5px; background-color:#4684C1; padding:5px; } ul#linki li.even{ background-color:#86AED7; } ul#linki li a{ font-weight:bold; color: #333333; } ul#linki li span{ font-size: 13px; padding-left:20px; }

Będzie trzeba zmodyfikować istniejące style bo "pogryzą" się z listą menu (zamień ul w selektorach, które są już na stronie na np. #menu_container ul ).


(Darom82) #18

cayman3_11 jest cos zle bo te bloczki sa za waskie na mojej stronie http://www.history.is.net.pl/?faq

I watpie zeby to tak mialo wygladac :frowning: Nawet niema ikonek z znakami zapytania.

Tak wyglada moj plik style.css

#menu_container { 

float: left; 

width: 210px; 

} 


#tresc { 

float: left; 

width: 521px;

color: #000033;

}


body {

 background-color: #6699CC;

}


#faq .wpis{

  background:#7093DB;

  margin:5px auto;

  padding:5px;

  position:relative;

  overflow:hidden;

}


#linki a { 

    color:#000; 

    text-decoration:none; 

}


#linki a:hover { 

    color:red; 

}


#link a { 

    color:#003399; 

    text-decoration:none; 

}


#link a:hover { 

    color:#4D4DFF; 

}


#wrap { 

margin: auto; 

width: 779px; 

}


ul, ul li {

   display: block;

   list-style: none;

   margin: 0;

   padding: 0;

}


ul li {

   width: 190px;

   padding-left: 10px;

   background: #3366CC no-repeat left top;

   border-width: 1px;

   border-style: solid;

   border-color: #003366 #0066FF #0066FF #003366;

}


ul a:link, ul a:visited {

   display: block;

   width: 169px;

   text-decoration: none;

   padding: 5px 10px;

   font-weight: bold;

   background: #6699FF repeat-x top;

   color: #333333;

   border-left: 1px solid #797;

}


ul a:hover {

   background-color: #0099CC;

   background-image: url("tlo2.gif");

   color: #000000;

}


*{margin:0;padding:0}

#pokaz1 {

   color: #003300;

}


#pokaz1 p {

   margin:0 0 10px 10px;

}


#footer a {

   text-decoration:none;

   color:#333333;

}


#footer a:hover { 

    color:#333333; 

}


ul#linki{

   color: #333333;

   list-style-image:url('/images/znak_zap.gif');

   list-style-position:inside;

   margin:0;

   padding:0;

}


ul#linki li{

   margin-bottom:5px;

   background-color:#4684C1;

   padding:5px;

}


ul#linki li.even{

   background-color:#86AED7;

}


ul#linki li a{

   font-weight:bold;

}


ul#linki li span{

   font-size: 13px;

   padding-left:20px;

}

Prosze o pomoc w tej sprawie.


(Damgora) #19

chyba nie zrozumieliśmy się - masz selektory

ul, ul li

ul li

ul a:link, ul a:visited 

ul a:hover

(mogłem jakieś przegapić) które powinieneś zamienić na

#menu_container ul, #menu_container ul li

#menu_container ul li

#menu_container ul a:link, #menu_container ul a:visited 

#menu_container ul a:hover

albo jakkolwiek inaczej ograniczyć je tylko do listy menu

ps. dodałem do stylów w poprzednim poście kolor linków taki jak był wcześniej


(Darom82) #20

cayman3_11 teraz jest dobrze, tylko że tresci http://www.history.is.net.pl/?faq nie wyswietla rowno pod przegladarka IE bo jest tak:

Początkujący webmaster

Podstawowe zagadnienia związane z PHP, HTML'em i innymi technologiami internetowymi.

A powinno byc tak:

Początkujący webmaster

Podstawowe zagadnienia związane z PHP, HTML'em i innymi technologiami internetowymi.

We wszystkich innych przegladarkach jest dobrze tylko w IE nie. Wiesz moze jak to poprawic ?