wersja skryptu MyBB:
adres forum:
na czym polega problem (screen, opis, komunikaty, nazwa stylu/theme/szablonu):
Witam, bawię sie ostatnio ze stylem "Reksio". Mocno go przerabiam na swoje potrzeby. Mam nastepujące pytanie. W jaki sposób mogę stworzyć obramowanie poszczególnych sekcji for? Mam na myśli obramowanie w taki sposób jak zaznaczyłem czerwoną linia na załączonym screenie.
Od razu przepraszam za wykorzystanie cudzego screena. Mam nadzieję, iż nie naruszam tym jakiegokolwiek regulaminu
SCREEN
Próbuję stworzyć ramkę dla każdej sekcji utworzoną za pomocą gotowych grafik. Niestety nie mam pojęcia gdzie powinienem szukać i czym dokładniej powinienem się posłużyć jeśli chodzi o css'a. Bowiem moje próby zakończyły się niepowodzeniem.
Bardzo dziękuję
Jeśli dokładnie taki cień i rogi to w CSS
border-radius: ileśtampx;
oraz
box-shadow: 0 0 5px 5px #888; (przykładowo)
Właśnie nie o to mi chodzi.
Mam 4 grafiki zrobione na potrzeby ramki. Każda odpowiada za jakiś bok.
Teraz chciałbym, aby te grafiki utworzyły ramkę.
Aby w ten sposób utworzyć ramkę, to trzeba będzie przerobić szablony
Opis działu
I do tabelki dodać nowe komórki, które będą odpowiadać za te grafiki.
Więc sporo pracy będzie
(25.10.2013, 19:29)gloverek napisał(a): [ -> ]Aby w ten sposób utworzyć ramkę, to trzeba będzie przerobić szablony Opis działu
I do tabelki dodać nowe komórki, które będą odpowiadać za te grafiki.
Więc sporo pracy będzie
Nareszcie jakiś konkret
W sumie nie myślałem o takim sposobie, ale jak najbardziej wiem już jak dokonać nurtującego mnie obramowania. Dzięki gloverek
Można również całą tabele poprzedzić div'em z padding, a tło całego diva zrobić w obrazku, które będzie naszą ramką
A do tła możesz dodać nawet 4 obrazki, które możesz przypisać do każdego boku za pomocą zwykłego background:
Generalnie próbowałem przypisać obrazki do ośmiu punktów: Góry, dołu, lewa, prawa i narożników.
Kodzik taki napisałem:
Kod:
#box {
border-top-image: url(images/lot/btop.jpg) repeat-x;
border-right-image: url(images/lot/bright.jpg) repeat-y;
border-bottom-image: url(images/lot/bottom.jpg) repeat-x;
border-left-image: url(images/lot/bleft.jpg) repeat-y;
border-top-left-image: url(images/lot/rog1.jpg) no-repeat;
border-top-right-image: url(images/lot/rog2.jpg) no-repeat;
border-bottom-left-image: url(images/lot/rog3.jpg) no-repeat;
border-bottom-right-image: url(images/lot/rog4.jpg) no-repeat;
}
Czysto z background przypisywało mi jedynie pierwszy adres grafiki. :/
Rozumiem, że zrobiłeś tak:
<div id="box">
<table>Tabelka działów</table>
</div>
CSS
Kod:
#box {
border-top-image: url(images/lot/btop.jpg) repeat-x;
border-right-image: url(images/lot/bright.jpg) repeat-y;
border-bottom-image: url(images/lot/bottom.jpg) repeat-x;
border-left-image: url(images/lot/bleft.jpg) repeat-y;
border-top-left-image: url(images/lot/rog1.jpg) no-repeat;
border-top-right-image: url(images/lot/rog2.jpg) no-repeat;
border-bottom-left-image: url(images/lot/rog3.jpg) no-repeat;
border-bottom-right-image: url(images/lot/rog4.jpg) no-repeat;
padding: 10px;
}
A tak z background:
Kod:
background: url(img/dots.jpg) no-repeat; /*definicja tła dla przeglądarek typu IE7/IE8*/
background: url(img/logo1.jpg) no-repeat 50px 300px,
url(img/logo2.jpg) no-repeat 850px 550px,
url(img/footer.jpg) repeat-x 0 bottom,
url(img/dots.jpg) no-repeat center 0;
hmmmm chyba nie do końca zrozumiałem. Podmieniłem trochę kody w css'ie
Kod:
#box {
background: url(images/lot/td.png) no-repeat;
background: url(images/lot/btop.jpg) top repeat-x,
url(images/lot/bright.jpg) right repeat-y,
url(images/lot/bottom.jpg) bottom repeat-x,
url(images/lot/bleft.jpg) left repeat-y;
}
A następnie wziąłem tabelkę w diva, ale efektu nie było żadnego. Stąd twierdzę, że coś źle wykonuję
Nie sprawdzałem nigdy, ale może spróbuj dodać te backgroundy do samej tabelki bez tego diva
Próbowałem już w ten sposób jakiś czas temu. Nie działa niestety.
Najpewniejszy moim zdaniem jest sposób jaki gloverek napisał z dodaniem komórek do tabeli i dodać padding. Będę próbował może nie dzisiaj, ale w najbliższym czasie. Napiszę tutaj jakie uzyskałem efekty
Chwilowo bawie się z kodami newpoints na mynetwork więc na tak skomplikowane "operacje" przyjdzie czas trochę później ^^
Dzięki wielkie za pomoc
Witajcie Szanowni Panowie. Rozwiązałem swój problem śpiewająco
Sposób podany przez Gloverka z tą różnicą, że wartości podane w pixelach nie są czytane na forum. Rozwiązanie leżało w procentach. Stąd np: fragment kodu powinien wyglądać tak:
Kod:
background: url(adres) 100%, url(adres) 100% 0% ...
A nie
Kod:
background: url(adres) 20px, url(adres) 34px ...