Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [HTML][CSS] Wyłączenie styli na elemencie
Forum PHP.pl > Forum > Przedszkole
Kshyhoo
Nie mogę poradzić sobie z wyłączeniem styli na tabeli: jsfiddle.net
Jak mógłbym wyłączyć działanie styli na tabeli "lokalnie", czyli w jednym wpisie?
Daimos
Nie wiem o co dokładnie chodzi z tym "lokalnie". Dla wszystkich elementów?
  1. .tutek *{
  2. border:none !important;
  3. background: none !important;
  4. margin: 0 !important;
  5. padding: 0 !important;
  6. }
Kshyhoo
Nie, chciałbym tak: jsfiddle.net
Johnas
Tak jak kolega wyżej napisał. Zbadaj element i dla elementu w którym chcesz wyłączyć background w css dodajesz atrybut style. Przykład dla diva:
  1. <div style="background: none !important;"> </div>


!important; ignoruje poprzednie style (również generowane przez javascript)
Kshyhoo
No tak, ale popatrz na przykład. tabelom nadaję klasy poprzez dziedziczenie pojemnika. Jest kilka tabel, jak usunąć ostylkowanie tylko z jednej? Podpowiadają mi, że mogę zrobić na zasadzie .tutek table:not(.pucuj), ale jeszcze pracuję nad zakumaniem tego cuda.
kamil4u
Bo oprócz głównej tabeli, musisz zmienić style wszystkim jego dzieciom: http://jsfiddle.net/MkF8M/3/

Jak nie oto chodzi opisz problem znacznie dokładniej wink.gif

Pozdrawiam
Kshyhoo
No właśnie wizualnie to jest to. Tylko teraz... nie widzę różnicy w kodzie HTML, czyli wyłączyłeś style dla tabeli nr 2, a ja bym chciał móc bez ingerencji w plik CSS wyłączyć style dla dowolnej tabeli. Np. mam 5 czy 8 tabel a chcę wyłączyć style dla 3 i 4...

Czyli coś takiego: jsfiddle.net.
kamil4u
No ale wygląd definiuje CSS, więc zmieniasz CSS. Ew. zrób sobie klasę w CSS i coś takiego: http://jsfiddle.net/MkF8M/4/ i
Kod
<table style="margin-left: 16px; width: 132px; background: #e7e7e7; float: right" border="0" cellpadding="0" cellspacing="0" class="bezStyli">


We wcześniejszej wersji zmieniałbyś:
Kod
.tutek table:nth-child(tu liczba), .tutek table:nth-child(tu liczba) *{


Mimo, że masz ponad 2500 postów i jesteś moderatorem to słabo Cię kojarzę z forum. No może ostatnio zrobiłeś się bardzo aktyny to Cię zaczynam kojarzę smile.gif Ale przez to, że Cię nie znam z forum bardzo dobrze to nie wiem na jakim poziomie jesteś z HTML czy CSS, więc nie wiem na ile i z czym masz problemy. Opisz proszę problem trochę lepiej to postaram się Ci wyjaśnić jak to działa.
Kshyhoo
Jestem amatorem i klepię dla siebie. Coś tam umiem i radzę sobie, ale nie uważam się za bóg wie jakiego eksperta. Twojego przykładu nie kumam wink.gif

EDIT: zauważyłem to class="bezStyli", teraz kumam wink.gif
kamil4u
Cytat
EDIT: zauważyłem to class="bezStyli", teraz kumam wink.gif


Czyli wszystko już ok i temat został wyczerpany? Coś wyjaśnić dodatkowo?
Kshyhoo
Gdybym chciał nadać klasę w pojedynczy artykuł? Czy mogę manipulować stylami z tego artykułu?

Albo nadać jakieś inne...
kamil4u
Jeśli dobrze rozumiem to tak.

Ale lepiej jakbyś napisał coś więcej. Naprawdę, gdy rzucasz ogólnymi hasłami czasem przychodzą mi do głowy różne pomysły i nie jestem pewien czy akurat to o czym pomyślałem to to o co pytałeś. Zawsze lepiej napisać dwa zdania więcej, żeby rozjaśnić sytuację, dać jakiś przykład smile.gif
Kshyhoo
No właśnie przykład, który zamieściłem, jest najlepszym przykładem, co chcę osiągnąć. Nadaję wszystkim tabelom style. Wybranej, chciałbym nadać inne, bezpośrednio w danym artykule, np. takie:
  1. .tx2 {font: 12px/16px Arial; text-align: right; padding-right: 4px;}

Ale to nie wystarcza, bo tabela dziedziczy style.

W pierwszym poście jest link. Są dwie tabele. Jedna "goła" a druga z nadanymi stylami. Chciałbym móc otrzymać taką gołą tabelę...
kamil4u
Dany artykuł jest trzymany w jakimś elemencie HTML, czy to <div> czy <article> czy dowolnym innym. Nadajesz mu klasę lub id - np. #test
Następnie elementowi dla którego chcemy coś zmienić znów nadajemy klasę lub id - np. #zmiana

Później już tylko w CSS: #test #zmiana{
/*css */
}

Dlaczego to zadziała? Rozszyfrujmy skrót CSS -> Cascading Style Sheets
Owa kaskadowość oznacza, że style które są jak najlepiej zdefiniowane( jak najdokładniej ) mają pierwszeństwo przed innymi. !important niszczy tą zależność. W praktyce oznacza to tyle, że gdy mamy: http://jsfiddle.net/LFGg7/
Dzięki nadaniu id dany styl lepiej określa kolor, dlatego "wygrywa" ze zwykłym span{ ... }

W Twoim przypadku gdy np. dodam do jakieś tabeli id to od razu mogę zmieniać lepiej dane style, bo mają większy priorytet: http://jsfiddle.net/MkF8M/6/
Gdy dodam !important to znów poprzedni styl jest ważniejszy: http://jsfiddle.net/MkF8M/8/
  1. .tutek tr:nth-child(odd) td {
  2. background: #fff !important;
  3. }


Mam nadzieję, że trochę Ci rozjaśniłem. W razie czego daj dokładny przykład tego co chcesz osiągnąć w stylu: to i to ma być takie, a to i to ma wyglądać tak

--- edit ---
http://jsfiddle.net/MkF8M/9/ <- to co chcesz osiągnąć.

W tym wypadku musisz usnąć tylko część styli. Z głównej tabelki wszystko prócz koloru, a z komórek td wszystko wink.gif

Kshyhoo
Cytat(kamil4u)
Dany artykuł jest trzymany w jakimś elemencie HTML, czy to <div> czy <article> czy dowolnym innym. Nadajesz mu klasę lub id - np. #test

Tak jak w przykładzie, mam <div class="tutek">.
Cytat(kamil4u)
Następnie elementowi dla którego chcemy coś zmienić znów nadajemy klasę lub id - np. #zmiana

Czyli u mnie .tutek .pucuj.
Cytat(kamil4u)
Mam nadzieję, że trochę Ci rozjaśniłem. W razie czego daj dokładny przykład tego co chcesz osiągnąć w stylu: to i to ma być takie, a to i to ma wyglądać tak

Teraz mam jasność. Dzięki za wytłumaczenie łopatologiczne.
Cytat(kamil4u)
http://jsfiddle.net/MkF8M/9/ <- to co chcesz osiągnąć.

W tym wypadku musisz usnąć tylko część styli. Z głównej tabelki wszystko prócz koloru, a z komórek td wszystko wink.gif

Właśnie to wink.gif
mar1aczi
Z użyciem podpowiadanego :not: http://jsfiddle.net/MkF8M/11/

Edit: poprawka małego błędu w kodzie na jsfiddle
Kshyhoo
Heh, to rozwiązanie wydaje mi się nawet łatwiejsze do opanowania:)
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.