logo elektroda
logo elektroda
X
logo elektroda
REKLAMA
REKLAMA
Adblock/uBlockOrigin/AdGuard mogą powodować znikanie niektórych postów z powodu nowej reguły.

kolor tła nie wyświatla się we wszystkich przeglądarkach - CSS

piotr_ka 22 Mar 2011 10:10 2861 12
REKLAMA
  • #1 9307562
    piotr_ka
    Poziom 13  
    Posty: 83
    Pomógł: 5
    Ocena: 32
    Strona jest zrobiona na DIVach + CSS. Podczas robienia, sprawdzalem poprawność w Operze, było ok., ale dopiero na koniec tknęło mnie by spawdzić w innych przeglądarkach i d....a. Firefox i IE ( który do nowych wersji nie należy) nie widzą koloru który jest wew. DIVa. mam efekt 100% przezroczystości.

    tło DIVa jest ustawione z parametram przezroczystości żeby było widoczne główne tło strony

    Kod: CSS
    Zaloguj się, aby zobaczyć kod

    Czy zabrakło jakiegoś kodu? coś powinienem dopisać by przeglądarki odpowiednio definiowały kod?


    za wszelkie sugestie dziekuje.

    Proszę pamiętać o używaniu znaczników syntax. Opcja Listing kodu. - arnoldziq
  • REKLAMA
  • #3 9310959
    piotr_ka
    Poziom 13  
    Posty: 83
    Pomógł: 5
    Ocena: 32
    zmieniłem kod na :

    color: #663366;
    filter:alpha(opacity=50);
    opacity: 0.5;
    -moz-opacity:0.5;

    ale efekt jest taki że zamiast otrzymać przezroczystość tła to obrazek i text przjmuje te funkcje a koloru tła DIVa wcale nie ma.
  • REKLAMA
  • #4 9311202
    s36725
    Poziom 17  
    Posty: 178
    Pomógł: 24
    Ocena: 23
    Bo color zmienia kolor tekstu, a nie tła. Od tego jest background-color.

    Nie doczytałeś w podsuniętym pod nos przykładzie, że dla kompatybilności ze starymi przeglądarkami musisz zagnieździć sekcje.

    Kod: text
    Zaloguj się, aby zobaczyć kod
  • #5 9312231
    piotr_ka
    Poziom 13  
    Posty: 83
    Pomógł: 5
    Ocena: 32
    zmieniłem na background- color ale nic nie zmieniło
    nadal mam tekst i gif przezroczysty

    Kod: text
    Zaloguj się, aby zobaczyć kod
  • Pomocny post
    #6 9312475
    s36725
    Poziom 17  
    Posty: 178
    Pomógł: 24
    Ocena: 23
    Faktycznie, wygląda na to, że potomny div zawsze dziedziczy przezroczystość.
    Poprawka (tworzymy dwa rownolegle DIVy, dzieki czemu przezroczystosc nie jest dziedziczona):

    Kod: text
    Zaloguj się, aby zobaczyć kod
  • #7 9312637
    piotr_ka
    Poziom 13  
    Posty: 83
    Pomógł: 5
    Ocena: 32
    dzięki. jest już trochę lepiej, otrzymalem potrzebną przezroczystość tła przy zachowaniu kolorów tekstu i GIFa. jednak jest jeszcze problem z wypozycjonowaniem obiektów ale to kwestia poprawek. tak zastanawialem sie czy przypadkiem p[roblem nie leży w układzie DIVów. tak jak pisałeś ze parametry są dziedziczone. wiem na czym mam sie teraz skupić. dzięki

    Dodano po 4 [godziny] 11 [minuty]:

    ok. wszystkie elementy są na miejscu.... ale
    czy da radę DIVa z tłem ustawić tak aby dostosowywał sie automatycznie?
    bo w kodzie jest coś takiego że:

    DIV główny ma 600 px szerokości a wysokośc auto zalezna od DIVa z textem.
    DIV z tłem ma 600 px szerokosci i 200 px wys. i teraz... czy da sie tak zrobić aby wysokosć diva z tlem też była automatyczna?
    bo na różnych podstronach ma różny tekst wiec i wysokość diva tez jest różna i kodów pod tło musiałbym robić kilka dla każdej pdstrony oddzielnie.
  • REKLAMA
  • #8 9313843
    s36725
    Poziom 17  
    Posty: 178
    Pomógł: 24
    Ocena: 23
    Powinno przejść:

    Kod: Javascript
    Zaloguj się, aby zobaczyć kod


    Kod: text
    Zaloguj się, aby zobaczyć kod


    Chyba, że skrypt ruszy przed wyrenderowaniem strony.. Ale o ile pamiętam, onLoad odpala po załadowaniu całej treści.
  • #9 9314119
    piotr_ka
    Poziom 13  
    Posty: 83
    Pomógł: 5
    Ocena: 32
    ...i co, to mi załatwi problem automatycznego dostosowania wielkosci diva "tło" ???
    bo tak w ogóle to nie wiem co to ma wspólnego z wyeliminowaniem pisania oddzielnego skryptu dla każdej strony na wielkosc DIVa z tłem.

    już się trochę zakręciłem
    :|
  • #10 9314142
    s36725
    Poziom 17  
    Posty: 178
    Pomógł: 24
    Ocena: 23
    Nie sprawdzisz, nie będziesz wiedział. Ale wg założenia skrypt ten przy załadowaniu strony przypisuje wysokości DIVa "tlo" wartość wysokości DIVa "tekst".
  • REKLAMA
  • #11 9314866
    piotr_ka
    Poziom 13  
    Posty: 83
    Pomógł: 5
    Ocena: 32
    niestety ale tak samo.
    DIV tło nie dostosowuje się do wielkości "teksu".

    nie wiem czy to ma znaczenie na zapis funkcji Java, ale moj css jest zew. plikiem.

    Dodano po 15 [minuty]:

    ..a może tak zrobić?
    Kod: text
    Zaloguj się, aby zobaczyć kod


    nie ma tyle niepotrzebnych DIVów. Div"tlo" nie zawiera w sobie innych elementów więc nie będą dziedziczyć jego ustawiń.

    tylko teraz script taki by div tlo miał wysokosć dostosowaną do div "tekst"

    funkcja height: auto;
    nie załatwia sprawy
  • #12 9314981
    s36725
    Poziom 17  
    Posty: 178
    Pomógł: 24
    Ocena: 23
    Cytat:
    ..a może tak zrobić? (...)

    W ten sposób nałożysz DIVa "tlo" na tekst, a nie pod tekst.

    OK, poprawka kolejna. Sprawdzona i działająca w FF3. W IE6 nie do końca...

    0) układ DIVów taki jak poprzednio pokazałem.

    1) poprawić funkcję onbodyload():
    Kod: Javascript
    Zaloguj się, aby zobaczyć kod


    2) skrypt zawrzeć w sekcji <HEAD>

    To, że style są zdefiniowane w CSS nie ma znaczenia.
  • #13 10336030
    piotr_ka
    Poziom 13  
    Posty: 83
    Pomógł: 5
    Ocena: 32
    pomysl ten porzuconu. temat zamykam

Podsumowanie tematu

LABEL_AI_GENERATED
Użytkownik zgłosił problem z przezroczystością tła DIVa w CSS, który działał poprawnie w Operze, ale nie w Firefoxie i IE. W odpowiedzi zasugerowano, że nie wszystkie przeglądarki wspierają wartości alpha w kolorach. Użytkownik próbował różnych rozwiązań, w tym użycia filtrów i zagnieżdżonych DIVów, aby uzyskać pożądany efekt przezroczystości. Ostatecznie zaproponowano utworzenie dwóch równoległych DIVów, co pozwoliło na uniknięcie dziedziczenia przezroczystości. Użytkownik również pytał o automatyczne dostosowanie wysokości DIVa z tłem do zawartości, co wymagało dodatkowego skryptu JavaScript.
Podsumowanie AI na podstawie dyskusji. Może zawierać błędy.
REKLAMA