Pseudo elementy CSS - pierwsze słowo

0

Czy istnieje jakiś pseudo element, który odwołuje się do pierwszego wyrazu? Chodzi mi o coś takiego jak first-letter, tyle że do całego słowa.

0

Nie. Poza tym uważaj z tymi pseudoelementami, bo nie wszystkie przeglądarki je wspierają (starsze IE! :( ). Pierwszy wyraz akurat łatwo oznaczyć jakimś elementem, np.

<span class="first-word">Pierwszy</span> drugi trzeci

Więc powinieneś być w stanie sobie łatwo poradzić, czy to po stronie serwera (PHP, Python, cokolwiek), czy klienta (w JavaScripcie). Potem możesz użyć normalnej klasy .first-word.

0

IE to chłam, a starsze wersje są żenujące, więc w ogóle nie zwracam na nie uwagi podczas projektowania stron, zwyczajnie procent użytkowników korzystających ze starszych wersji IE jest znikomy.

Co do twojej podpowiedzi, to debilem nie jestem i gdybym mógł skorzystać ze z wykłej deklaracji klasy, zrobiłbym to :D
Niestety treść do zmiany jest tworzona dynamicznie, dlatego jeśli chcę wykorzystać klasę, potrzebuję czegoś co pozwoli wyodrębnić to pierwsze słowo.
Zastanawiałem się czy nie jest możliwe napisanie kawałka kodu, który zadziała tak, że będzie można wyciągnąć count=0 ze zmiennej $title i tym samym przypisać temu elementowi jakąś klasę.

0

@Robster:

Robster napisał(a)

o debilem nie jestem i gdybym mógł skorzystać ze z wykłej deklaracji klasy, zrobiłbym to

Oj, uważaj z takimi stwierdzeniami! Bo jeszcze Ci zaraz udowodnię, że możesz z niej skorzystać i dopiero sytuacja zrobi się... niezręczna ;). Ja jednak nic nie mówię!

Robster napisał(a)

Niestety treść do zmiany jest tworzona dynamicznie, dlatego jeśli chcę wykorzystać klasę, potrzebuję czegoś co pozwoli wyodrębnić to pierwsze słowo.

Co za problem? Skoro dynamicznie, to masz jakiś backend, jak rozumiem? Wyodrębnienie pierwszego słowa w PHP to PIKUŚ i to z tych pikusi pisanych wielkimi literami.

To nie jest budowa rakiety kosmicznej. To nie jest nawet wyodrębnienie pierwszej linii, które w PHP byłoby niewiele łatwiejsze od zbudowania tej rakiety ;). Mając jakiś tekst nie wiesz bowiem, jak przeglądarka go wyświetli. Jak długie będą linie? Jaki będzie stopień pisma? Krój? Kerning i tracking? Dlatego prawdziwie elastyczne, uniwersalne oznaczenie pierwszej linii byłoby małą masakrą.

Ale tu masz pierwszy wyraz! Wyodrębnienie go jest łatwe! Wystarczy to zrobić i otoczyć go odpowiednim znacznikiem z klasą first-word. Zrobi to bez problemu PHP czy dowolny inny język backendowy. Najprościej byłoby użyć funkcji typu strpos i odszukać pierwszą spację w tekście. Na podstawie jej pozycji można podzielić tekst na dwie części: pierwszy wyraz i resztę, a następnie otoczyć pierwszą część spanem. Inna, bardziej kuloodporna opcja, to użycie wyrażeń regularnych i dopasowanie pierwszego słowa (bo za pierwszym słowem może teoretycznie być coś innego niż spacja: przecinek, kropka, znak zapytania etc.).

Możesz więc dynamicznie otoczyć pierwszy wyraz spanem z klasą first-word, a potem się do tej klasy odnosić.

Albo ja tu czegoś nie rozumiem, albo Ty ;).

0
Robster napisał(a)

IE to chłam, a starsze wersje są żenujące, więc w ogóle nie zwracam na nie uwagi podczas projektowania stron, zwyczajnie procent użytkowników korzystających ze starszych wersji IE jest jest znimokomy

A możesz podać źródło o stanie znikomości użytkowników IE6?

0

@GhostDog:
Być może chodziło mu o użytkowników jego witryn. Faktycznie, IE6 zostało już dawno zarzucone przez 37signals. Od marca web-appy Google też przestaną wspierać IE6. Znam jeszcze kilka agencji, które przynajmniej dla niektórych swoich klientów olewają IE6 jeśli chodzi o wyświetlenie layoutu zbliżonego do pełnego. Zamiast tego dorzucają skrypt (JavaScript) upgrade'ujący zachowanie IE6 tak, by działało mniej więcej jak IE7. Albo dają dla IE6 bardzo prosty arkusz stylów, wspólny dla wszystkich ich projektów.

0
GhostDog napisał(a)
Robster napisał(a)

IE to chłam, a starsze wersje są żenujące, więc w ogóle nie zwracam na nie uwagi podczas projektowania stron, zwyczajnie procent użytkowników korzystających ze starszych wersji IE jest jest znimokomy

A możesz podać źródło o stanie znikomości użytkowników IE6?

http://www.iai-shop.com/pr-press-release.phtml?id=1235323376 - niecałe 8% internautów korzysta z tej wersji, a biorąc pod uwagę dość często wyświetlającą się informację o aktualizacji wersji można dojść do wniosku jacy internauci to są i ile czasu spędzają w internecie.
Projektując stronę aktualne wersje IE przysparzają mi już tyle problemu, że nie mam najmniejszej ochoty w bawienie się nad tworzeniem osobnego CSS i metod pod wersję 6.

bswierczynski jedną linię można łatwo wyciągnąć przez first-line i nie ma sensu bawić się przy tym w php :D
Co do debilizmu podtrzymuję swoje zdanie, gdyby dało się to zrobić przez CSS, to bym to już zrobił biorąc pod uwagę czas jaki poświęciłem na szukanie rozwiązania pod CSS.
A wchodząc w szczegóły, to próbuję tą modyfikację wdrożyć pod Joomle, by zmienić kolor pierwszych słów w tytułach modułów i tematach artykułów, tak jak to jest zrobione na mepi.pl :D

0
Robster napisał(a)

jedną linię można łatwo wyciągnąć przez first-line i nie ma sensu bawić się przy tym w php

Ja na pewno nie zabierałbym się za to w PHP. Czarną wizję takiej implementacji przedstawiłem dla kontrastu z łatwym i przyjemnym zrobieniem sobie first-word ;).

Robster napisał(a)

Co do debilizmu podtrzymuję swoje zdanie, gdyby dało się to zrobić przez CSS, to bym to już zrobił biorąc pod uwagę czas jaki poświęciłem na szukanie rozwiązania pod CSS.

Hmm, a ja od razu nie kojarzyłem czegoś takiego jak first-word, a potwierdzenie tego w specyfikacji CSS zajęło mi może z minutę. Gdybyś więc na to szukanie poświęcił nawet i 5 minut (zamiast nie wiem ilu... godziny?), to pewnie zostałoby Ci dość czasu, by zrobić sobie odpowiednią funkcję w Joomli. Ot, parę linijek i trochę testów.

0
Robster napisał(a)

Co do debilizmu podtrzymuję swoje zdanie, gdyby dało się to zrobić przez CSS, to bym to już zrobił biorąc pod uwagę czas jaki poświęciłem na szukanie rozwiązania pod CSS.

Hmm, a ja od razu nie kojarzyłem czegoś takiego jak first-word, a potwierdzenie tego w specyfikacji CSS zajęło mi może z minutę. Gdybyś więc na to szukanie poświęcił nawet i 5 minut (zamiast nie wiem ilu... godziny?), to pewnie zostałoby Ci dość czasu, by zrobić sobie odpowiednią funkcję w Joomli. Ot, parę linijek i trochę testów.

Do tych samych wniosków doszedłem po mniej więcej tym samym czasie, ale mówiąc o szukaniu chodziło mi o szukanie, w ogóle. Źle złożyłem zdanie i wyszło, jak wyszło :)
Miałem nadzieję, że da się w jakiś sposób zmodyfikować first-letter lub first-line, tak by wyciągnąć to jedno słowo, ale dupa wyszła :/

Biorę się za ten kod php, zobaczymy co wyjdzie :D

0
Robster napisał(a)
GhostDog napisał(a)
Robster napisał(a)

IE to chłam, a starsze wersje są żenujące, więc w ogóle nie zwracam na nie uwagi podczas projektowania stron, zwyczajnie procent użytkowników korzystających ze starszych wersji IE jest jest znimokomy

A możesz podać źródło o stanie znikomości użytkowników IE6?

<url>niecałe 8% internautów korzysta z tej wersji

Jeszcze zależy czy rozglądasz się w gronie 16-latków czy bezrobotnych, dziadków i tym podobnych. Bo ja na stronach projektów unijnych notuję około 16% wielbicieli IE6. Wszystko zależy od targetu strony - na co innego można sobie pozwolić pisząc 4P, a na co innego robiąc projekty unijne dla bezrobotnych.</url>

0

Oczywista sprawa, ale moje strony najczęściej ograniczają się do blogów, stron domowych, portfolio, stron wizytówek. Jednym słowem chodzi o to by strony wyglądały dobrze na jak największej ilości przeglądarek. Nie wliczam w to IE6 oraz starszych. Za dużo zabawy, przy minimalnych korzyściach.
Zresztą i nowsze IE nie należą do moich ulubieńców.

1 użytkowników online, w tym zalogowanych: 0, gości: 1