Forum Debian Users Gang

pink · 2011-10-14 14:09:45

jak zignorowac styl css w kodzie html

chodzi o to aby w czesc dokumentu html kozystala ze stylu a czesc nie, albo lepiej kozystala z innego???

hello_world · 2011-10-14 14:58:12

W sumie możesz podpiąć wiele plików styli(aby mieć porządek), natomiast w kodzie strony określasz np ten div i dzieci mają korzystać z innej klasy lub identyfikatora.
Albo definiujesz na samej górze style podstawowe
body{...} i dalej jedziesz już z klasami i innymi znacznikami jak Ci sie podoba

Minio · 2011-10-14 14:59:26

Nie da się zrobić tak, aby część strony korzystała ze stylów, a część nie. Zwłaszcza że nie ma czegoś takiego, jak „brak stylu”. Jeżeli tylko przeglądarka internetowa obsługuje style, to każdy element na stronie jakiś styl ma (autora serwisu, użytkownika, przeglądarki internetowej).

Poczytaj w specyfikacji o kaskadzie i specyficzności (ang. specificity) CSS:
http://www.w3.org/TR/CSS2/cascade.html#cascade

W ostateczności podaj przykładowy kod i opisz, co chciałbyś osiągnąć.

pink · 2011-10-15 21:27:41

ja sie nie znam tak sie tylko bawie a nuz cos z tego wyjdzie??

Kod:

<html>
<body>
<head>
<link rel=StyleSheet href="external_sheet.css"
type="text/css">
</head>
<body>
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="#news">Design</a></li>
<li><a href="kites.html">Kites</a></li>
<li><a href="#about">About</a></li>
</ul>
</body>
<hr/>    
<h1 style="font-family:verdana">pinkflood kitespot</h2>
<hr/><hr/><hr/>
<br/><br/>
<img src="images/latawce/midi.jpg"/><p/>
<img src="images/latawce/midi2.jpg"/><p/>
<img src="images/latawce/midinexus.jpg"/><p/>
<img src="images/latawce/midi&nexus2.jpg"/><p/>
<ul>
<li><a href="galerie/B&W/index_B&W.html">album 1</a></li>
<li><a href="galerie/color/index_color.html">album 2</a></li>
<li><a href="http://www.pinkflood.weebly.com/">pinkflood.weebly.com</a></li>
<li><a href="http://www.dug.net.pl/">dug.net.pl</a></li>
<li><a href="http://www.000webhost.com/">free webhosting</a></li>
</ul>
</html>

to jest glowna i chce aby kazda inna bazowala na tym samym tylko miala inne tlo, ale nie umiem

Kod:

body {
  background: url("images/background.gif") 50% 50% no-repeat;
}
ul
{
list-style-type:none;
margin:0;
padding:0;
padding-top:6px;
padding-bottom:6px;
}
li
{
display:inline;
}
a:link,a:visited
{
font-weight:bold;
color:#FFFFFF;
background-color:#323232;
text-align:center;
padding:6px;
text-decoration:none;
text-transform:uppercase;
}
a:hover,a:active
{
background-color:#a40022;
}

to jest css
i wybaczcie mi moje totalne ignoranctwo w tym zakresie.

NIC · 2011-10-15 22:16:29

Złe podejście do sprawy. Tu nie trzeba ustawiania "braku stylu", ale trzeba po prostu "ustalić styl". Od tego jest kaskadować:

<tag id="nazwa_stylu_z_kratką" />
<tag class="nazwa_stylu_z_kropeczką" />
<tag class="nazwa_stylu_z_kropeczką inna_nazwa_stylu_z_kropeczką" />

A w pliku *.css można jeszcze stosować kaskadę zależności rodzinnych:

tr td div div {
color:red;
}

Ustawić powinno tylko kolor czcionki czerwony dla tagów DIV znajdujących się za tymi wszystkimi tagami wcześniej wypisanymi (tr td div ). Inne są nietykane.

Zmiana tła dla podstron? Potrzeba PHP i losować jakoś nazwę stylu w class="".

pink · 2011-10-15 22:43:55

ok, to co musze poczytac najpierw????

hello_world · 2011-10-15 22:56:16

@pink
No generalnie zawsze się jakoś zaczyna , a jak każdy wie z czytania się nie nauczysz tylko z kodowania. Metodą prób i błedów i dojdziesz do celu. Problem w tym że na koncu jak wszystko ładnie zrobisz i przez przypadek odpalisz stronę w IE to się załamiesz
Ja zaczynałem przygodę z Css kilka lat temu od ksiażek Erica Meyera(autorytet w css) ale w sumie teraz jest tyle poradników że możesz sobie oszczędzić książki
dobra strona jest webmaster.helion.pl

Ostatnio edytowany przez hello_world (2011-10-15 22:58:42)

pink · 2011-10-15 23:15:01

generalnie to nie bardzo chce zaczynac bo glowa juz nie ta, zreszta nigdy sie do informatycznych zagadnien nie nadawala (glowa), no ale jak juz mam ten webhosting to se cos naskrobie postanowilem (prostego wmiare), ale to takie proste nie jest jednak.

Minio · 2011-10-16 10:34:26

pink napisał(-a):
to jest glowna i chce aby kazda inna bazowala na tym samym tylko miala inne tlo, ale nie umiem

Ma mieć tylko inne tło, tak? To widzę przynajmniej trzy rozwiązania:

1. Na każdej podstronie <body> (czy tam inny element) ma inne id. Dajesz jeden styl, w którym masz regułę dla body oraz dla body#identyfikator (po jednej na każdy identyfikator). Dzięki temu jeżeli kiedyś zapomnisz identyfikatora, to będzie domyślne tło dla strony. Przeglądarka najpierw odczyta właściwości dla body a potem dla body#identyfikator, więc w tym drugim możesz np. zmienić tylko obrazek (jeżeli pozycjonowanie ma być takie samo za każdym razem).

2. Dajesz jeden styl globalny z większością reguł i wiele prostych stylów z regułą body dla każdej podstrony. Na każdej stronie załączasz styl globalny i jeden ze stylów dla podstron.

3. Tworzysz w PHP (czy czymkolwiek wolisz) skrypt, który na podstawie nagłówka HTTP_REFERRER wysyła odpowiedni obraz. Masz jeden plik CSS na wszystkich podstronach, ale obrazek jest generowany dynamicznie za każdym razem. Nie jestem tylko pewien czy przeglądarka wyśle nagłówek HTTP_REFERRER, ale nawet jeśli nie, to powinna wysłać jakiś inny pozwalający zidentyfikować, na jakiej podstronie znajduje się użytkownik.

Generalnie łatwiej Ci będzie, jeżeli znasz jakikolwiek język skryptowy wykonywany po stronie serwera, gdyż w przeciwnym wypadku będziesz musiał się sporo napisać (i dbać przy aktualizacji żeby nic się nie posypało — chodzi zwłaszcza o nowe strony, które będziesz dodawać).

pink · 2011-10-18 23:05:38

Kod:

<html>
<head>
<style type="text/css">
div.img
{
  margin: 2px;
  border: 1px solid #0000ff;
  height: auto;
  width: auto;
  float: left;
  text-align: center;
}    
div.img img
{
  display: inline;
  margin: 3px;
  border: 1px solid #ffffff;
}
div.img a:hover img {border: 1px solid #0000ff;}
div.desc
{
  text-align: center;
  font-weight: normal;
  width: 120px;
  margin: 2px;
}
</style>
</head>
<body>

<div class="img">
 
 <img src="klematis4_small.jpg" alt="Klematis" width="110" height="90" />


</body>
</html>

a jak zrobic coby kazdy nastepny obrazek dodawal sie po koleji obok do konca pojemnika, a potem pod spodem itd.

pink · 2011-10-18 23:06:45

to nie ja pisalem tylko zrylem ten kod z w3s i chce dostosowac pod siebie.

Ostatnio edytowany przez pink (2011-10-18 23:46:19)

pink · 2011-10-18 23:11:15

o wlasnie zauwazylem ze mi sie wirek dodal, :-)

ArnVaker · 2011-10-18 23:27:55

pink napisał(-a):
o wlasnie zauwazylem ze mi sie wirek dodal, :-)

haha, jakieś pół roku temu :D

pink · 2011-10-18 23:45:38

lepiej pozno niz wcale, myslalem ze mi na pieciu stanelo.

Forum Debian Users Gang

Ogłoszenie

#1 2011-10-14 14:09:45

pink - Użytkownik

style css

#2 2011-10-14 14:58:12

hello_world - Członek DUG

Re: style css

#3 2011-10-14 14:59:26

Minio - Użyszkodnik

Re: style css

#4 2011-10-15 21:27:41

pink - Użytkownik

Re: style css

Kod:

Kod:

#5 2011-10-15 22:16:29

NIC - Członek DUG

Re: style css

#6 2011-10-15 22:43:55

pink - Użytkownik

Re: style css

#7 2011-10-15 22:56:16

hello_world - Członek DUG

Re: style css

#8 2011-10-15 23:15:01

pink - Użytkownik

Re: style css

#9 2011-10-16 10:34:26

Minio - Użyszkodnik

Re: style css

pink napisał(-a):

#10 2011-10-18 23:05:38

pink - Użytkownik

Re: style css

Kod:

#11 2011-10-18 23:06:45

pink - Użytkownik

Re: style css

#12 2011-10-18 23:11:15

pink - Użytkownik

Re: style css

#13 2011-10-18 23:27:55

ArnVaker - Kapelusznik

Re: style css

pink napisał(-a):

#14 2011-10-18 23:45:38

pink - Użytkownik

Re: style css

Stopka forum