Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: nieprzezroczysty tekst
Forum PHP.pl > Forum > Po stronie przeglądarki > CSS
Leone
14.07.2008, 22:15:41
Witam
Mam pewien problem, z którym nie wiem jak sobie poradzić.

W CSS ustawiłem tło i rozciągnąłem je na całą stronę.
Na tym ustawiłem diva, a następnie ustawiłem mu przezroczystość.
Tekst wpisywany w tym divie także jest objęty przezroczystością, a tego nie chcę.

Mniej więcej wygląda to tak:

[HTML] pobierz, plaintext 
  1. <body>
  2. <div id="motto">
  3. tresc wpisywana w divie
  4. </div>
  5. </body>
[HTML] pobierz, plaintext 


[HTML] pobierz, plaintext 
  1. #motto {
  2. -moz-opacity: 0.3;
  3. alpha(opacity): 30;
  4. opacity: 0.3;
  5. background-color: #FFF
  6. }
[HTML] pobierz, plaintext



Ponieważ wysokość diva ma się dostosowywać do wielkości treści, która jest w nim, nie mogę ustawić tych dwóch elementów (diva i tekstu) oddzielnie, a następnie umieścić w tym samym miejscu.

Szukałem w google i znalazłem pewną podpowiedź na tej stronie.
Korzystając z tego udaje mi się co prawda uzyskać przezroczystość, która pozostawia normalny tekst, ale za nic w świecie nie mogę jej ustawić tak, aby zapełniała całą zawartość diva.
Dochodzę do czegoś takiego:

[HTML] pobierz, plaintext 
  1. <div id='motto2'>
  2. <span class='tresc'>Osobliwe dni dopadły nas<br>
  3. Samotnie spędzamy osobliwe godziny<br>
  4. Pomieszane ciała, wykorzystane wspomnienia<br>
  5. A my uciekamy przed dniem<br>
  6. W osobliwą kamienną noc.</span>
  7. <div class="trans">
  8. </div>
  9. </div>
[HTML] pobierz, plaintext 


[HTML] pobierz, plaintext 
  1. #motto2 {
  2. position: relative;
  3. z-index: 10;
  4. padding: 10px 10px;
  5. top: 25px;
  6. left: 50px;
  7. width: 250px;
  8. border: medium solid #7FFFD4;
  9. }
  10. .trans {
  11. z-index: 50;
  12. opacity: 0.3;
  13. filter: alpha(opacity=30); 
  14. -moz-opacity: 0.3;
  15. background: #FFF;
  16. width: auto;
  17. position: relative;
  18. height: 50px;
  19. }
  20. .tresc {
  21. position: relative;
  22. z-index: 90;
  23. color: #000;
  24. width: 280px;
  25. padding: 10px;
[HTML] pobierz, plaintext


I dalej nie wiem jak to ruszyć.

Ktoś ma pomysł, jak ustawić, aby tło w divie było przezroczyste, natomiast napisy normalne (bez przezroczystości)?
I ważne, wysokość diva albo elementu dającego przezroczystość nie może być ustalona na stałe, a ma się zmieniać w raz z ilością tekstu w divie.
mike
14.07.2008, 22:35:00
W tle obrazek 1x1 pixel powtarzany w pionie i poziomie.
To jedyne rozsądne rozwiązanie.

Robienie oddzielnego bloku na przezroczystość i oddzielnego na tekst to przerost formy nad treścią.
Leone
14.07.2008, 22:45:32
tylko, że tło to nie jest jakiś pattern czy coś tego rodzaju.. to najzwyklejsza grafika, a właściwie zdjęcie.
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.