[html, css] Gradient eliptyczny

0

Jak zrobic gradient w pionie wykorzystujac html i css wiem. Jak poziomy takze. Ale... czy ktos z was wie, co zrobic, aby otrzymac eliptyczny gradient? Tzn. jedna barwa np. w lewym gornym rogu i promieniscie w kazda strone stopniowo przechodzi w inna barwe?

Niestety SVG odpada, bo jest za slabo obslugiwane przez przegladarki ;(. Filtry IE oraz Flash tak samo odpadaja (ale juz z troche innych powodow :) ).

0

Z ciekawości spytać: jak zrobić te poziome/pionowe gradienty? Nie znam żadnej własności css ani html, która by się tym zajmowała...

0

Z ciekawości spytać: jak zrobić te poziome/pionowe gradienty? Nie znam żadnej własności css ani html, która by się tym zajmowała...

Jezeli chesz np. gradient od lewej do prawej, na szerokosci 760px to tworzysz taki gradient w programie graficznym o wysokosci 1px.
W CSS dajesz:
body {
background: url(sciezka_do_pliku.jpg) repeat-x fixed;
}
I juz :)
Dla pionowego robisz analogicznie, tylko odwrotne proporcje dla obrazka i repeat-y.

0

No to teraz mnie rozłożyłeś... Myślałem, że znasz jakiś tajemny sposób, co by przy użyciu tylko css i html można było gradienciki robić :). W takim razie: żeby zrobić gradient eliptyczny, robisz taki w programie graficznym i wstawiasz jako tło. Trudne? :D

0

Trudne? :D

Tak. Bo nie stala mam tylko szerokosc okna, ale nie wysokosc i nie wiem jak duza grafike musze przygotowac. Moglbym teoretycznie przygotowac jakiegos giganta, ale zalezy mi na tym, by strona byla w miare lekka.

0

Troszke mnie to zainteresowalo, choc jest to nie wykonalne to moze
zadowoli Cie pokretne rozwiazanie z filtrami dzialajace takze pod Mozillami :)

http://piechnat.iglu.cz/download/Css%20Filters%20-%20Test.html

0

To jeżeli chcesz to zrobić zgodnie ze standardami, to inaczej niż przez bezpośrednie wstawianie a się nie da. Może coś takiego będzie w CSS3...

0

To jeżeli chcesz to zrobić zgodnie ze standardami, to inaczej niż przez bezpośrednie wstawianie a się nie da. Może coś takiego będzie w CSS3...

hmmm.... a czy to o czym mowisz to nie beda przypadkiem dzilania majce na celu wstawienie sobie odnosnika do validatora css na stronie ? bo jesli tak, to wez pod uwage ze validator html potrafi podac pozytywny wynik dla stron w XHTML 1.1 z naglowkiem text/html :-D

0

Walidator jest przydatny, ale jak każde narzędzie - nie jest doskonały. poza tym nie ma czegoś takiego jak znaczek walidatora - jest znaczek, który mówi, że strona jest zgodna ze standardem... nie z walidatorem. Czy potrzebujesz naprawdę walidatora, żeby sprawdzić, czy nie popełniłeś żadnych błędów gramatycznych/rzeczowych w np. wypracowaniach? Słowniki też sprawdzą tylko ortografię.

BTW, gdzie jest napisane, że dokument xhtml 1.1 musi być przesyłany z mime application/xhtml+xml? Z tego co pamiętam, to w jakimś dokumencie w3 spotkałem się tylko ze słówkiem should.

0

Walidator jest przydatny, ale jak każde narzędzie - nie jest doskonały.

Właśnie to napisałem w poprzednim poście, milo ze się ze mną zgadzasz... :-*

poza tym nie ma czegoś takiego jak znaczek walidatora - jest znaczek, który mówi, że strona jest zgodna ze standardem... nie z walidatorem.

Czy ja pisałem o znaczku ? napisałem odnośnik do validatora CSS czyli hiperłącze prowadzące do strony z validatorem CSS. Czy to takie skomplikowane ?

Czy potrzebujesz naprawdę walidatora, żeby sprawdzić, czy nie popełniłeś żadnych błędów gramatycznych/rzeczowych w np. wypracowaniach? Słowniki też sprawdzą tylko ortografię.

O co Ci chodzi ?

Cos czuję ze nie zrozumiałeś dokładnie treści mojego poprzedniego postu wiec spróbuje Ci go wyjaśnić:

Wydaje mi się (dlatego użyłem formy pytającej) że jeśli coś jest niezgodne ze standardami to gdzie byś tego nie wstawił (czy to w tagu czy w nagłówku czy osobny pliku) to i tak nadal będzie niezgodne ze standardami. Z drugiej strony pomyślałem sobie skąd Ci to mogło przyjść do głowy ? Czy masz jakieś konkretne informacje ? Później jednak przypomniało mi się że validator CSS tak funkcjonuje tzn nie sprawdza poprawności w tagach i skojarzyłem to z twoją wypowiedzią. Czy teraz już rozumiesz moje pytanie ?

BTW, gdzie jest napisane, że dokument xhtml 1.1 musi być przesyłany z mime application/xhtml+xml? Z tego co pamiętam, to w jakimś dokumencie w3 spotkałem się tylko ze słówkiem should.

hmm.... w FAQ :-D

http://quiris.klub.chip.pl/w3c/xhtml-faq.htm#mime11

0

Troszke mnie to zainteresowalo, choc jest to nie wykonalne to moze
zadowoli Cie pokretne rozwiazanie z filtrami dzialajace takze pod Mozillami :)

http://piechnat.iglu.cz/download/Css%20Filters%20-%20Test.html

Piechnat: jestes moim guru htmlowym. To jest genialne. Ale jak z dzialaniem pod innymi?

Co do sporu dot. xhtml to ta strona moze byc jak najbardziej zgodna z xhtml. To czego uzywa tam piechnat, to jedynie css niezgodny ze standardem, ale xhtml mozna z tego zrobic jak najbardziej. Zawartosc i wyglad :)

0

Właśnie to napisałem w poprzednim poście, milo ze się ze mną zgadzasz...

Odebrałem to jako ironię (zwłaszcza przez tę buźkę), że niby program do sprawdzania błędów jest wadliwy, bo nie wychwytuje ich wszystkich. Ganz egal, na jedno wychodzi.

Czy ja pisałem o znaczku ? napisałem odnośnik do validatora CSS czyli hiperłącze prowadzące do strony z validatorem CSS. Czy to takie skomplikowane ?

Znaczek, odnośnik, wszystko jedno. I tak chodzi o pokazanie, że strona jest zgodna ze standardami.

Poza tym, moim zdaniem należy unikać wszystkich takich kruczków (takich jak te filtry) wykorzystujących błędy w walidatorach - bo nie tędy droga. Przyjdzie nowa przeglądarka, nie zrozumie ich i pomysł nie zadziała. Myślałem, że właśnie chcesz takie błędy wykorzystać - zasugerowałem się Twoim przykładem, w którym były m.in. IE'owe filtry, do tego ten nieironiczny post z buźką wrednie naśmiewającą się.

Dzięki za link do tego spolszczonego faq. Czytałem to kiedyś po angielsku (chyba) i zgubiłem je gdzieś.

0

Dryobates:

Ale jak z dzialaniem pod innymi?

Wszystkie browsery które mam na składzie to kupują
IE 6, Opera 7, Mozilla 1.7, Phoenix 0.5, FireFox 0.9, Netscape 7
tyle że z tym gradientem nie jest zbyt dobrze, trzeba trochę pokombinować z nasyceniem kolorów i tłem a z uwagi na pół-przezroczystość i tak nie osiągnie się właściwych barw...

Liorithiel:

Trochę jestem znużony tą dysputą ale jako że mam dziś wojowniczy nastrój to Ci odpiszę :-P

Znaczek, odnośnik, wszystko jedno.

Nie wszystko jedno :-[ bo prawisz mi morały na temat tego że "nie ma czegoś takiego jak znaczek walidatora". Oczywiście, że nie ma tylko, że ja napisałem "odnośnik do validatora" a coś takiego istnieje - czyli przekręciłeś moje słowa na potrzeby swojego wyimaginowanego argumentu. Myślałeś że nie zauważę i przyznam Ci rację ?

Poza tym, moim zdaniem należy unikać wszystkich takich kruczków (takich jak te filtry) wykorzystujących błędy w walidatorach - bo nie tędy droga.

To bardzo dobrze, że teraz tak uważasz ale cały spór zaczął się od tego że zasugerowałeś mi użycie takiego kruczku wykorzystującego błędy validatora i co najważniejsze stwierdziłeś że w tedy strona będzie zgodna ze standardami natomiast to że validator nie wyświetla błędów nie oznacza że strona jest poprawna więc poczułem powinność uświadomienia tego tobie...

Jeszcze raz przypomnę twoje słowa żeby nie było że ja przekręcam:

To jeżeli chcesz to zrobić zgodnie ze standardami, to inaczej niż przez bezpośrednie wstawianie a się nie da.

0

Nie wszystko jedno

A litera nie jest znaczkiem (znakiem graficznym)? A odnośnik nie jest "znaczkiem", który ma oznaczać, że strona jest zgodna? OK, może i nie jest. Zostawmy to, bo nie ma sensu o tym dyskutować/kłócić się.

A co jest niewłaściwego w zgodnym ze standardami wstawianiu:
w treść pliku *.[x]html gdzieś na początku sekcji <body />?

0

A litera nie jest znaczkiem (znakiem graficznym)?

co próbujesz udowodnić ? że znasz już alfabet :-D bo jakoś nie kumam...

A odnośnik nie jest "znaczkiem", który ma oznaczać, że strona jest zgodna?

na prawdę nie dociera do ciebie ? miałeś czelność poprawiać mnie pisząc:

nie ma czegoś takiego jak znaczek walidatora - jest znaczek, który mówi, że strona jest zgodna ze standardem...

natomiast ja napisałem odnośnik do validatora - jest coś takiego jak odnośnik do validatora - po kliknięciu przenosi on do strony z validatorem, dociera ?

oskarżasz mnie o błędy których nie popełniłem, próbujesz mi wmówić że napisałem coś co według ciebie nie istnieje ale ja tego nie napisałem, jasne ? :-[ :-[ :-[ [diabel]

A co jest niewłaściwego w zgodnym ze standardami wstawianiu:
w treść pliku *.[x]html gdzieś na początku sekcji <body />?

nie rozchodzi się o z-index tylko o filtry, jesteś niepoczytalny, masz sklerozę czy strugasz wariata ? :-D

0

Ok, z tym znaczkiem faktycznie przesadziłem. Przepraszam.

A co do reszty... mi też już się nie chce dyskutować na ten temat. Chyba nie bardzo się zrozumieliśmy. Nie wiem po co w ogóle stosować przezroczystość (IE'owe filtry, gecko'we -moz-opacity, operowe opacity), jeżeli można po prostu na tym rysunku namalować gradient. Zapisany w odpowiednim formacie na pewno nie będzie zbyt duży. Odpada przy okazji problem niekompatybilności.

0

Ok, z tym znaczkiem faktycznie przesadziłem. Przepraszam.

przeprosiny przyjete [cygaro]

jeżeli można po prostu na tym rysunku namalować gradient

w tym jednym Ci musze przyznac racje, przez moja kosmiczna :-D wizje dwoch lekkich pol-przezroczystych obrazkow ktore rozciagniete wzajemnie sie uzupelnia umknelo mi ze prosciej jest zrobic jeden ciezszy kwadrat z ukosnym gradientem i go rozciagnac, to jednak dlatego ze moim priorytetem byla oszczednosc zer i jedynek...

0

Koniec. Ktos tu za duzo smieci w MOIM temacie :P
Co do gradientow to nie moge umiescic 1 obrazka, bo nie wiadomo jakie beda rozmiary strony. Z rozwiazania piechnata ostatecznie tez nie skorzystam, bo okazalo sie, ze gradient poziomy najlepiej wyglada. Inna sprawa, ze ten gradient eliptyczny troszke spowalnia wyswietlanie stronki.
Nie mniej mozna spokojnie w FAQ umiescic ten przepis, bo jest ciekawy.

A znaczek walidatora gdzies i tak wstawie jezeli maszynka mi wywali, ze jest zgoodne :P

/* ma ktos ochote mnie poprawiac? [diabel] */

0

Zaraz...
To tutaj http://piechnat.iglu.cz/download/Css%20Filters%20-%20Test.html jest gradient eliptyczny? :|
Bo u mnie normalny, poziomy (ie 6)...

0

Zaraz...
To tutaj http://piechnat.iglu.cz/download/Css%20Filters%20-%20Test.html jest gradient eliptyczny? :|
Bo u mnie normalny, poziomy (ie 6)...

Eliptyczny, tylko jego środek jest w lewym górnym rogu.

1 użytkowników online, w tym zalogowanych: 0, gości: 1