notatki-html

Forum dla graczy do pisania ogólnych próśb o pomoc. Zarówno członkowie załogi i doświadczeni gracze mogą na nim pomóc w rozwiązaniu problemów, z jakimi spotkają się gracze. Prosimy nie prowadzić pogawędek na tym forum.

Moderators: Public Relations Department, Players Department

User avatar
OktawiaN :)
Posts: 827
Joined: Sun Oct 09, 2005 1:29 pm
Location: PL 34-325

notatki-html

Postby OktawiaN :) » Sun Jan 08, 2006 4:15 pm

Mam problem. Wpisuje ciagle w <body> <body bgcolor=red> a tlo sie nie zmienia. Jak mozna zmienic kolor tla notatki??
[url=http://pajacyk.pl][img]http://www.stoczek.net.pl/gmina/files/baner_pajacyk%5B1%5D.jpg[/img][/url]Pajacyk.pl
User avatar
Raist
Posts: 919
Joined: Wed Aug 24, 2005 6:42 pm
Location: POLAND

Postby Raist » Sun Jan 08, 2006 4:28 pm

Nie mozesz wewnatrz kodu deklarowac body ;) Jezeli chcesz zrobic tlo to stworz tabele np:

<table border=0 cellpadding=0 cellspacing=0 width=100% bgcolor=#00000>
<tr>
<td></td>
</tr>
</table>

Rozbuduj i dostosuj do wlasnych potrzeb :)
User avatar
WojD
Posts: 1968
Joined: Mon Oct 31, 2005 6:14 am
Location: PL
Contact:

Postby WojD » Sun Jan 08, 2006 6:05 pm

albo

<div style="background: #CC0000; width: 100%">

treść

</div>
==============
User avatar
OktawiaN :)
Posts: 827
Joined: Sun Oct 09, 2005 1:29 pm
Location: PL 34-325

Postby OktawiaN :) » Sun Jan 08, 2006 6:16 pm

Dzieki. Wojda sposob jest najlepszy ;)
Moze spiszecie jakies pomocne kody, ktore moga byc uzywane w Cantr??
[url=http://pajacyk.pl][img]http://www.stoczek.net.pl/gmina/files/baner_pajacyk%5B1%5D.jpg[/img][/url]Pajacyk.pl
User avatar
WojD
Posts: 1968
Joined: Mon Oct 31, 2005 6:14 am
Location: PL
Contact:

Postby WojD » Sun Jan 08, 2006 6:38 pm

Dobra - zaraz napisze tutorial.
==============
Jifer
Posts: 43
Joined: Tue Nov 01, 2005 8:29 pm
Location: Polska
Contact:

Postby Jifer » Sun Jan 08, 2006 6:54 pm

Hehe... po co tutorial...

Pamiętaj tylko o 2 rzeczach:

1.Jeśli robisz coś oprócz tekstu i chcesz zrobić coś w bardziej zaawansowany sposób rób to w tabeli lub w div'ie. Nacisk kładę jednak na div. Jeśli średnio znasz się na stronach, to po prostu załóż, że są lepsze.
Jak bardzo potrzebujesz wiedzieć, to mogę wyjaśnić, lub zajżyj na linkas poniżej. Wejdź w css->wstawianie->wydzielone bloki

2.Program Cantr w notatkach uznaje spacje i entery. W ramach tabeli musisz je sam definiować (<br> <p> i inne)

Całą resztę znajdziesz tutaj:
http://www.kurshtml.boo.pl
To wg. mnie najlepszy poradnik jak znalazłem. Mało jaka książka mu dorównuje. Podaje nawet zachowania pewnych skryptów dla konkretnych przeglądarek.

Poza twoimi umiejętnościami i zasadami Cantr nic Cię nie ogranicza.
User avatar
WojD
Posts: 1968
Joined: Mon Oct 31, 2005 6:14 am
Location: PL
Contact:

mini tutorial HTML

Postby WojD » Sun Jan 08, 2006 7:35 pm

Podane niżej tagi (x)HTML moga być bez problemów stosowane w notatkach. A rezultat ich stosowania mozna zobaczyć w prosty sposób - skopiujcie poniższy tekst i wklejcie do notatki. A potem EKSPERYMENTUJCIE!



Ogólne uwagi:

wszystkie tagi poza <br> <p> i <img> musza mieć tag zamykający - <h3>ZAWSZE ZAMYKAMY TAGI</h3>

przy zapisywaniu notatki tekst i kod są formatowane przez specjalny skrypt, który automatycznie dodaje nowe wiersze, jeślinie chcemy podzielenia tekstu czy obrazków - między tagami nie może być spacji ani nowych wierszy


1. Formatowanie i umieszczanie tekstu

Code: Select all

 <br>Tekst przykładowy  br<br>
- wymuszone złamanie wiersza

Code: Select all

<div>Tekst przykładowy  div</div>
- tag div służy do pozycjonowania zawartości i zostanie omówiony dalej.

Code: Select all

<em>Tekst przykładowy  em</em>
równoważne

Code: Select all

<i>Tekst przykładowy  i </i>
kursywa

Code: Select all

<h1>Tekst przykładowy  h1,<h1>
- nagłowek 1 stopnia

Code: Select all

<h2>Tekst przykładowy  h2,<h2>
- nagłowek 2 stopnia

Code: Select all

<h3>Tekst przykładowy  h3,<h3>
- nagłowek 3 stopnia

Code: Select all

<h4>Tekst przykładowy  h4,<h4>
- nagłowek 4 stopnia

Code: Select all

<h5>Tekst przykładowy  h5,<h5>
- nagłowek 5 stopnia

Code: Select all

<h6>Tekst przykładowy  h6</h6>
- nagłowek 6 stopnia

Code: Select all

<p>Tekst przykładowy  p</p>
- nowy akapit

Code: Select all

<span>Tekst przykładowy  span</span>
- tag span służy do specjalnego formatowania fragmentu zawartości i zostanie omówiony dalej

Code: Select all

<strong>Tekst przykładowy  strong</strong>
równoważne

Code: Select all

<b> Tekst przykładowy  b </b>
wytłuszczenie

2. Linki:

Code: Select all

<a>Tekst przykładowy  a</a>
<b>Nie wolno stosować w notatkach linków zewnętrznych. Można natomiast użyć linku do

Code: Select all

<a>miejsca do którego odsyłamy</a>
(kotwicy) wewnątrz notatki</b>

3. Listy:
<ol>Tekst przykładowy ol</ol> Lista numerowana
<ul>Tekst przykładowy ul</ul> Lista wypunktowana
<li>Tekst przykładowy li</li> Punkt listy

Przykładowy kod listy:

Code: Select all

          <ol>
          <li>Punkt 1</li>
          <li>Punkt 2</li>
          <li>Punkt 3</li>
          </ol>


4. Tabele:


Przykładowy kod tabeli:

Code: Select all

          <table>
          <tr>
          <td>wiersz 1 komórka 1</td>
          <td>wiersz 1 komórka 2</td>
          </tr>
          <tr>
          <td>wiersz 2 komórka 1</td>
          <td>wiersz 2 komórka 2</td>
          </tr>
          </table>


5. Obrazy:

EDIT: Obrazki dodajemy wyłącznie przy pomocy systemu dostępnego na stronie tworzenia notatek. System podaje kod, który należy wkleić w oknie edycji notatki.


6. Tagi <div> i <span> oraz korzystanie z atrybutu style

Przy pomocy tagu <div> można między innymi pozycjonować treść i nadać kolor tła. Najlepiej jest to zrobić przy użyciu stylów. Polega to na umieszczeniu w tagu atrybutu style="" - na przykład:

Code: Select all

<div>
TREŚĆ
</div>


background: kolor tła - hex (#FFFFFF = biały; #000000 = czarny;) lub angielska nazwa koloru (red, blue, navy, white, black)
width: szerokość w pikselach
height: wysokość w pikselach
color: kolor tekstu - hex (#FFFFFF = biały; #000000 = czarny;) lub angielska nazwa koloru (red, blue, navy, white, black)
text-align: wyrównanie tekstu (domyślnie do lewej) left, center, right

W podobny sposób - przy pomocy tagu <span> można wydzielić fragment tekstu, do którego zastosujemy inne niż dla reszty zasady. Na przykład:

Code: Select all

<div>
TREŚĆ jakaś TREŚĆ jakaśTREŚĆ jakaśTREŚĆ jakaśTREŚĆ <span>jakaśTREŚĆ jakaśTREŚĆ jakaśTREŚĆ jakaśTREŚĆ jakaśTREŚĆ jakaśTREŚĆ jakaśTREŚĆ jakaśTREŚĆ jakaśTREŚĆ </span>jakaśTREŚĆ jakaśTREŚĆ jakaśTREŚĆ jakaś
</div>


Dotyczy to również wierszy i komórek tabeli - oraz innych tagów w ograniczonym zakresie.
Last edited by WojD on Wed Jul 19, 2006 8:12 pm, edited 3 times in total.
==============
Jifer
Posts: 43
Joined: Tue Nov 01, 2005 8:29 pm
Location: Polska
Contact:

Postby Jifer » Sun Jan 08, 2006 9:16 pm

Co nie zmienia faktu, że formatowania style=" można używać niemalże do wszystkiego. w <table style=""> można formatować nawet text, przezroczystość (firefox nie uznaje) i masę innych.
Widzę Wojd, że też lubisz w tym się bawić :]
Dam do tego powyżej tylko drobną uwagę (świetne streszczenie. Esencja tego co potrzebne), a mianowicie: dlaczego od razu X? Nie wystarczą zwykłe tagi HTML?

(mała propozycja Wojd: wszystkie kody zrób w ramkach "code". Będzie czytelniejsze i "niekumaci" -bez obrazy- będą wiedzieli o co chodzi)
User avatar
NiKnight
Posts: 791
Joined: Thu Jun 23, 2005 8:32 pm

takie tam spostrze&#380;enia o IE i FF ;)

Postby NiKnight » Sun Jan 08, 2006 9:37 pm

Firefox nie uznaje bo trzyma się zaleceń W3C, dzięki temu strony są prawidłowo czytane. Niestety Microsoft zamiast forsować swoje rozwiązania w organizacji W3C woli je od razu stosować, dlatego dochodzi do bardzo złych sytuacji, gdzie strona może być oglądana tylko przez IE. Co dla uzytkowników Linuxa, BSD czy innego systemu jest strasznie kłopotliwe :/

Dobrze, że podaliście kody, mam tylko nadzieję, że forma notatki nie będzie górować nad jej treścią :wink:
Ni Ni Ni Ni!
User avatar
WojD
Posts: 1968
Joined: Mon Oct 31, 2005 6:14 am
Location: PL
Contact:

Postby WojD » Sun Jan 08, 2006 9:49 pm

:)

dlaczego (x)html ?

Z prostej przyczyny: wierzę, że za niedługi czas kod szablonów Cantr zostanie dostosowany do zaleceń W3C czyli własnie do XHTML'a - im mniej będzie kolizji w kodzie tym sprawniej wszystko będzie działać

Poza tym xhtml to esencja html - dodatkowo oczyszczona z wszelkich brudów...

(x) dlatego, że nie do końca jest to czysty kod - trzeba by tak naprawdę narzucic reguły, których 'zwykli smiertlnicy' nie zrozumieją chociazby bez poznania xml'a

style - szablony maja byc oparte na css'ach (arkuszach stylów) - użycie stylów inline (sorry za żargon - czyli takich w tagach <div style=""> zapewni, że większość tak zrobionych notatek zachowa swój wygląd. Nie wiem, czy szablony będa 100% bazować na klasach - jeśli tak, to problemów nie będzie żadnych - ale jesli nie - to czasem notki mogłyby by zabawnie się zmienić...

Jifer wrote:Widzę Wojd, że też lubisz w tym się bawić :]


Bawić? Nie cierpię tego. To moja praca...



No dobra...


Lubię :)


Zrobiłem w ramkach code - ale nie wiem, czy jest czytelniej...
==============
Jifer
Posts: 43
Joined: Tue Nov 01, 2005 8:29 pm
Location: Polska
Contact:

Postby Jifer » Mon Jan 09, 2006 12:37 pm

Jest czytelniej :]
Twoja praca? Co konkretnie robisz? Pytam, bo ja biegnę właśnie w tym kierunku. To mnie kręci. Design stron i grafika. Jedno i drugie.
Chociaż przyznam szczerze, że nie przepadam za php... w moim odczuciu to strasznie zawiły język... wolę pascala lub c++
Właśnie kończę licka i ruszam dalej na infę... ciężko będzie się dostać :(

Co do Xa macie rację. Zwróciłem jedynie na to uwagę, gdyż tagi są lekko pozmieniane. Osobiście bywa, że mam problemy, które wynikają z przyzwyczajenia do starego html i css2

Tworzenie statycznych stron jest problemem... właśnie przez przeglądarki. Np. FF nie pozwala na zmianę kolorystyki scrollbara. To spory minus.
Przekonałem się jednak, że poza pewnymi ograniczeniami "estetycznymi" (bo FF również nie uznaje stałego tła zdefiniowanego za pomocą css / html) to sprawuje się najlepiej. Czyta strony idealnie, nie ma problemów z ramkami i ustawianiem, co natomiast jest problemem w IE.

Jest jeszcze jedna rzecz. Są pewne rzeczy, które programiści z Opery, Mozilli, Netsapea pomineli: np. Java.
Zapraszam na:
http://secure.onet.pl/midasplayer/login ... Findex.jsp
zrozumiecie o co mi chodzi.
User avatar
marol
Posts: 3728
Joined: Sun Jul 17, 2005 11:45 am
Location: Kraków, PL
Contact:

Postby marol » Mon Jan 09, 2006 12:54 pm

Jifer wrote:Chociaż przyznam szczerze, że nie przepadam za php... w moim odczuciu to strasznie zawiły język... wolę pascala lub c++
Yyy? Toż to prawie to samo... A co do IE - gdzieś przeczytałem coś takiego:
Internet Explorer służy do przeglądania Internetu z twojego komputera i odwrotnie.
:D
User avatar
NiKnight
Posts: 791
Joined: Thu Jun 23, 2005 8:32 pm

Postby NiKnight » Mon Jan 09, 2006 12:59 pm

Mała dygresja:

Chociaż przyznam szczerze, że nie przepadam za php... w moim odczuciu to strasznie zawiły język... wolę pascala lub c++


PHP poznałem na tyle, że jestem w stanie stworzyć prostą gierkę a la Cantr, zresztą tworzyłem ale musiałem przestać (czas). Niestety w porównaniu z Javą PHP jest strasznie nieuporządkowany, do tworzenia stron jednak bardziej sie nadaje niż Java (a dokładnie JSP, servlety i applety), jest po prostu łatwiejszy i w niektórych przypadkach szybszy :)

Zresztą język dobiera się do problemu a nie odwrotnie :wink:
Ni Ni Ni Ni!
User avatar
WojD
Posts: 1968
Joined: Mon Oct 31, 2005 6:14 am
Location: PL
Contact:

Postby WojD » Mon Jan 09, 2006 2:22 pm

Jifer wrote:Twoja praca? Co konkretnie robisz?


http://wojd.eu.org

jest w profilu zresztą ;)



Jifer wrote: Czyta strony idealnie, nie ma problemów z ramkami i ustawianiem, co natomiast jest problemem w IE.


Niestety - wiekszosc userow nada korzysta z IE - statsy ze strony mojego klienta:

Internet Explorer 79 %
Mozilla 16.2 %
Opera 3.8 %
Netscape 0.6 %
Konqueror 0 %


Ludzie sklaniaja sie w strone Mozilli - to z mojego portfolio statsy:

Internet Explorer 58.5 %
Mozilla 31 % 31 %
Opera 7.5 %
Netscape 1.6 %
Konqueror 0.3 %
Google 0.1 % [LOL!]


Jifer wrote: Jest jeszcze jedna rzecz. Są pewne rzeczy, które programiści z Opery, Mozilli, Netsapea pomineli: np. Java.
Zapraszam na:
http://secure.onet.pl/midasplayer/login ... Findex.jsp
zrozumiecie o co mi chodzi.


Niezupełnie - to system płatności onetplayera i midasplayera jest niekompatybilny z normalnymi przegladarkami i microsoftocentryczny ;) Widzisz - to aplikacje mają być dla przeglądarek www a nie przeglądarki dla aplikacji www
==============
User avatar
marol
Posts: 3728
Joined: Sun Jul 17, 2005 11:45 am
Location: Kraków, PL
Contact:

Postby marol » Mon Jan 09, 2006 2:42 pm

Cantr:
1. Mozilla Firefox 1.x 40.2 %
2. Internet Explorer 6.x 33.0 %
3. Opera 8.x 9.3 %
4. Internet Explorer 5.x 7.2 %
5. Mozilla Firefox 7.2 %
6. Mozilla 1.x 1.0 %
Unknown 2.1 %

Return to “Ogólna pomoc”

Who is online

Users browsing this forum: No registered users and 1 guest