+- Forum Webmastera, HTML, CSS, PHP, MySQL, Hosting, Domeny - Forum dla Webmasterów (https://www.webmastertalk.pl)
+-- Dział: Technologie internetowe - tworzenie stron WWW (https://www.webmastertalk.pl/forum-technologie-internetowe-tworzenie-stron-www)
+--- Dział: Początkujący webmaster (https://www.webmastertalk.pl/forum-poczatkujacy-webmaster)
+--- Wątek: Zaokrąglone rogi (/thread-zaokraglone-rogi)
Strony:
1
2
Zaokrąglone rogi - Melixo - 28-07-2010
Witam. Robię stronę i chciałbym, aby tło nagłówków h1 miało zaokrąglone rogi. Tło jest grafiką i pociąłem tak by lewe zaokrąglenie było razem ze środkiem, a druga grafika to prawe zaokrąglenie. Gdyby to był div to nie miałbym problemu, niestety w tym przypadku musi to być tło h1 i nie ma innego wyjścia. Widziałem jakieś poradniki o zaokrągleniach z border, ale są one po angielsku i nie wszystko jest dla mnie do końca zrozumiałe. Liczę na waszą pomoc. Pozdrawiam.
RE: Zaokrąglone rogi - lukasz323 - 28-07-2010
spróbuje strzelić na background .gif po prostu nie jest to ciężkie tylko może się źle duplikować zależy od teksty no chyba, że tło h1 może być jednej wielkość nie zależni od tekstu.
w innym przypadku jest więcej zabawy np. z małą kulką którą ustawiasz w rogach i robi ci zaokrąglenia no ale określ co ci potrzeba najpierw
RE: Zaokrąglone rogi - asd5 - 28-07-2010
zobacz
http://www.limeto.pl/pliki/Zaokraglenie w IE 6 ;D.zip ANG
http://www.webmastertalk.pl/okragly-div-w-ie-t-3936.html PL
http://www.devwebpro.com/25-rounded-corners-techniques-with-css/ ANG
http://www.kminek.pl/okragle-rogi-tylko-za-pomoca-css/ PL
RE: Zaokrąglone rogi - Dhofca - 28-07-2010
border-radius: xx px;
-moz-border-radius: xx px;
-webkit-border-radius: xx px;
RE: Zaokrąglone rogi - Melixo - 28-07-2010
(28-07-2010, 06:39)Dhofca napisał(a): border-radius: xx px;One nie działają niestety pod IE6. I prosze nie piszcie nic typu daj sobie spokoj z ie6 itd... to po prostu musi tam także działać.
-moz-border-radius: xx px;
-webkit-border-radius: xx px;
(28-07-2010, 04:11)lukasz323 napisał(a): ale określ co ci potrzeba najpierwMam 2 pliki "zaokrąglenie-left.jpg" i "zaokraglenie-right.jpg" i teraz chciałbym użyć ich jako:
h1 {
background: url(...) left no-repeat;
background: url(...) right no-repeat;
}
Oczywiście wiem, że w ten sposób to jest niemożliwe to tylko dla przykładu. Powoli zdaję sobie sprawę, że z grafiką tego nie zrobię, więc jeśli znacie komende pod ie6 to bardzo bym o nią prosił. W ostateczności użyje javascript, i chętnie poczytam jakiś poradnik jak tego użyć
Aha a co do grafiki, jest ona w 2 częściach, ponieważ nie ma mieć stałej szerokości, tylko dopasowywać się do tekstu.
RE: Zaokrąglone rogi - Pedro84 - 28-07-2010
Cytat:One nie działają niestety pod IE6. I prosze nie piszcie nic typu daj sobie spokoj z ie6 itd... to po prostu musi tam także działać.To użyj js... Używanie grafik do rogów mija się z jakimkolwiek celem...
Komenda pod IE6: Użyj js. Google.pl Cię naprowadzi.
RE: Zaokrąglone rogi - lukasz323 - 28-07-2010
dość przewrotny kod no ale można z tego coś wciągnąć
css:
h1{
background:url(prawy rog.jpg) no-repeat right top;
float:left;
margin:0;
text-align:left;
}
h1 span{
background:url(lewyrog.jpg) no-repeat right top;
width:20px;
height:20px;
margin:0;
padding:0;
display:block;
}
html:
<h1><span></span>123123</h1>
RE: Zaokrąglone rogi - Melixo - 28-07-2010
(28-07-2010, 16:53)lukasz323 napisał(a): dość przewrotny kod no ale można z tego coś wciągnąć
css:
h1{
background:url(prawy rog.jpg) no-repeat right top;
float:left;
margin:0;
text-align:left;
}
h1 span{
background:url(lewyrog.jpg) no-repeat right top;
width:20px;
height:20px;
margin:0;
padding:0;
display:block;
}
html:
<h1><span></span>123123</h1>
Myślałem nad tym rozwiązaniem, ale one także odpada. Robię strone dla firmy i zażyczyli sobie panel zarządzania treścią. Panel który stworzyłem ma opcje do nagłówków tylko h1,h2 ... bez żadnych span. Gdybym to ja zarządzał stroną to nie widziałbym żadnych problemów, ale tu jest inna sprawa z ludźmi którzy nie mają pojęcia nawet o html. No to najwidoczniej muszę użyć javascript :/ jak znacie fajne poradniki to dajcie linka, chyba, że już was wyprzedzę. I dzięki za chęć pomocy.
RE: Zaokrąglone rogi - lukasz323 - 28-07-2010
ale h1 stosuje się tylko i wyłącznie do nazwy artykułu więc możesz strzelić stały h1 z importem z bazy treści
RE: Zaokrąglone rogi - Pedro84 - 28-07-2010
(28-07-2010, 17:32)lukasz323 napisał(a): ale h1 stosuje się tylko i wyłącznie do nazwy artykułu więc możesz strzelić stały h1 z importem z bazy treści
Nie tylko, ale powinien być użyty na stronei tylko raz.