Navigacija
Lista poslednjih: 16, 32, 64, 128 poruka.

Css i pseudo zjbncje

[es] :: Web dizajn i CSS :: Css i pseudo zjbncje

[ Pregleda: 1917 | Odgovora: 5 ] > FB > Twit

Postavi temu Odgovori

Autor

Pretraga teme: Traži
Markiranje Štampanje RSS

plus_minus

Član broj: 289459
Poruke: 2242
*.dynamic.isp.telekom.rs.

Sajt: https://hardcoder.xyz


+2247 Profil

icon Css i pseudo zjbncje25.02.2014. u 23:56 - pre 123 meseci
Zamislimo da imamo ovakav deo koda.

Code (html):


<pre><code contentedibatle="true">

<?php // Some php script

function simpleFunction() {
 
 return var_export( get_defined_vars(true), true );

}

</code></pre>

 


... i da takav deo koda trebamo ofarbati sa css-om, ali - bez kamare span tagova sa prilepljenim klasama (svi uveliko koristimo neko od ličnih ili ostalih js rešenja, naravno) okolo fraza i kontrolne strukture, itd.

Ono što ne znam da li je uopšte moguće, niti da li css može da ofarba samo ključne reči koje su predefinisane u sklopu određenog taga...

Nešto na fazonu :before ili :after ..

Kontam da takvo pseudo pravilo još uvek ne postoji...

npr.

Code:


/* Css */

 pre code::kwd( "array" ) { color:Navy; }
 pre code::kwd( "=", "[", "]", "(", ")", "{", "}" ) { color:Olive; }
 pre code::kwd( "class", "function", "extends", "abstract", "private", "public", "protected" ) { color:Orange; }



.. ili je tako nešto zapravo moguće, samo nisam dovoljno informisan?

about:networking
 
Odgovor na temu

Zeberdee
Misel Tekinder
Freelance Web Designer/Front-End
Developer
Niš

Član broj: 177025
Poruke: 59

Sajt: www.behance.net/MiselTeki..


+4 Profil

icon Re: Css i pseudo zjbncje05.03.2014. u 21:34 - pre 123 meseci
Zelis da ofarbas kod unutar code taga?

pre > code { color: green; }

Sto bi na css jeziku znacilo:
Ofarbaj u zeleno svaki "code" tag koji se nalazi direktno u "pre" tag-u.

Sa :before i :after pseudo klasama bi ofarbao sadrzaj pre i posle nekog taga, ne i unutar istog taga.
 
Odgovor na temu

plus_minus

Član broj: 289459
Poruke: 2242
*.dynamic.isp.telekom.rs.

Sajt: https://hardcoder.xyz


+2247 Profil

icon Re: Css i pseudo zjbncje05.03.2014. u 23:20 - pre 123 meseci
Ne, ne, nee... Ne želim da ofarbam kod unutar code taga, već samo određene ključne reči u sklopu code taga, ali bez <span style="color:infotext"> </span>,
ili bez

pre code.green { color:Green; }

... jer ne treba mi kamara code tagova svugde gde ima KODA. To već imam, samo što nisu code već span tagovi.
To što si stavio će sav tekst unutar code taga da ofarba u zeleno ukoliko na određenom kodu ne prilepim klasu koja farba u drugu boju.

Ne radi se tako Mićo.
Jedan <pre><code> </code></pre> sklop i unutar toga TONA koda ako treba.
Ne wrapuješ svaku reč u kodu u <code> tag, pobogu.. :D

Za sad, za takve stvari koristim highlight.js koji odlično radi posao i poprilično je sitan, što mi odgovara, ali, kada bi to moglo css-om, na kontu @nekih (jel- postoje uopšte?) pseudo pravila.. jer kasnije moram da php-om ubijam sve span tagove koje highlight nadžidža, u toku dalje obrade..

Css, dakle, samo ključne reči da izgađa i ofarba.
Jer ako sa :before/after može da se ispiše tekst na ekranu u samo jednom css svojstvu, bez bilo kakve upotrebe dodatnih html tagova.. nelogično mi je da ne može obična boja da se izgađa i prikaže na ekranu..

Znači, da kada vidiš html source kod.. i kada vidiš izgenerisani i izmanipulisani html source kod iz firebuga, npr.. da to bude ISTO, a kada to gledaš u svom finalnom izdanju, da ima i boje.
U svakom slučaju, najverovatnije da to što ja hoću, neće da može još.
Mora da se strpim još mnogo...

ps: izbegavaj da stavljaš "veće od" već samo običan razmak bez obzira jel' samo za primer ili ne.

pre code { color: green; }
about:networking
 
Odgovor na temu

Zeberdee
Misel Tekinder
Freelance Web Designer/Front-End
Developer
Niš

Član broj: 177025
Poruke: 59

Sajt: www.behance.net/MiselTeki..


+4 Profil

icon Re: Css i pseudo zjbncje06.03.2014. u 08:39 - pre 123 meseci
Citat:
plus_minus: Ne, ne, nee... Ne želim da ofarbam kod unutar code taga, već samo određene ključne reči u sklopu code taga, ali bez <span style="color:infotext"> </span>,
ili bez

pre code.green { color:Green; }

... jer ne treba mi kamara code tagova svugde gde ima KODA. To već imam, samo što nisu code već span tagovi.
To što si stavio će sav tekst unutar code taga da ofarba u zeleno ukoliko na određenom kodu ne prilepim klasu koja farba u drugu boju.

Ne radi se tako Mićo.
Jedan <pre><code> </code></pre> sklop i unutar toga TONA koda ako treba.
Ne wrapuješ svaku reč u kodu u <code> tag, pobogu.. :D


Shvatio sam da ne wrap-ujes svaku rec, mislio sam da sve reci zelis da ofarbas unutar to jednog <pre><code></code></pre>, nisam video da si napisao kako ubacujes kljucne reci ...

Citat:

Za sad, za takve stvari koristim highlight.js koji odlično radi posao i poprilično je sitan, što mi odgovara, ali, kada bi to moglo css-om, na kontu @nekih (jel- postoje uopšte?) pseudo pravila.. jer kasnije moram da php-om ubijam sve span tagove koje highlight nadžidža, u toku dalje obrade..


Ne postiji to sto zelis, bez da ubacujes neki tag putem jquery-ja. Cak ni u css3-ci.

Citat:

Css, dakle, samo ključne reči da izgađa i ofarba.
Jer ako sa :before/after može da se ispiše tekst na ekranu u samo jednom css svojstvu, bez bilo kakve upotrebe dodatnih html tagova.. nelogično mi je da ne može obična boja da se izgađa i prikaže na ekranu..


Moze da se ispise ali se ne vidi kad odes u source kod. I ne mozes da dodajes svasta, samo text, poneki atribut i sliku.

Citat:

Znači, da kada vidiš html source kod.. i kada vidiš izgenerisani i izmanipulisani html source kod iz firebuga, npr.. da to bude ISTO, a kada to gledaš u svom finalnom izdanju, da ima i boje.
U svakom slučaju, najverovatnije da to što ja hoću, neće da može još.
Mora da se strpim još mnogo...


Mozes da selektujes sa malo jquery-ja, bez dodatnih skripti sa strane.

Citat:

ps: izbegavaj da stavljaš "veće od" već samo običan razmak bez obzira jel' samo za primer ili ne.

pre code { color: green; }


Ako stavis > to znaci da ce da ofarba samo direktnog potomka, u slucajevima gde se "code" nalazi direktno u "pre".
<pre><code></code></pre>

U sucajevima gde imas:
<pre><p><code></code></p></pre> ili
<pre><p><i><code></code></i></p></pre>

nece da dira nista. Ako me razumes.
Sa > imas vecu kontrolu selektovanja, a u tome i jeste car css-a. ;)
Ali vidim da ti to ne treba.

Uostalom daj finalan izgled koji zelis, ovako preko koda gore, vidim samo da ubacujes nesto ...
 
Odgovor na temu

plus_minus

Član broj: 289459
Poruke: 2242
*.dynamic.isp.telekom.rs.

Sajt: https://hardcoder.xyz


+2247 Profil

icon Re: Css i pseudo zjbncje06.03.2014. u 16:37 - pre 123 meseci
Citat:
Ne postiji to sto zelis, bez da ubacujes neki tag putem jquery-ja. Cak ni u css3-ci.


To sam i ja do sad skontao, skontao sam zapravo još pre par godina, ali rekoh možda sam malo popustio.

Citat:
Moze da se ispise ali se ne vidi kad odes u source kod. I ne mozes da dodajes svasta, samo text, poneki atribut i sliku.


Znam da ne može svašta, i znam da se ne vidi u source kodu, nisam ja od juče u web developmentu..
to svašta se odnosilo na tekst, reč ili image, gde reči mogu da budu - svašta.

Citat:
Ne postiji to sto zelis, bez da ubacujes neki tag putem jquery-ja. Cak ni u css3-ci. ...

Mozes da selektujes sa malo jquery-ja, bez dodatnih skripti sa strane.


A zašto ne sa ličnim .js kodom ili sa highlight.js .. ?
jQuery iz inata ne koristim, već duži niz godina. Ima razloga zašto.

Citat:
Ako stavis > to znaci da ce da ofarba samo direktnog potomka, u slucajevima gde se "code" nalazi direktno u "pre".
<pre><code></code></pre>

U sucajevima gde imas:
<pre><p><code></code></p></pre> ili
<pre><p><i><code></code></i></p></pre>

nece da dira nista. Ako me razumes.
Sa > imas vecu kontrolu selektovanja, a u tome i jeste car css-a. ;)
Ali vidim da ti to ne treba.

Uostalom daj finalan izgled koji zelis, ovako preko koda gore, vidim samo da ubacujes nesto ...


I to isto dobiješ i sa najobičnijim razmakom...
i isto tako si automatski pružio bolju podršku i za starije pretraživače..
i isto neće da dira pre nego samo code.

Hvala na zalaganju, btw, ali ne trebaju meni časovi iz css-a..

Elem, što se koda tiče, nema šta puno da se nagađa šta treba.. gore u prvom postu sam okačio šta mi treba,
no, evo ponovo.. u letu ..

Code (php):

<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8>
<title>No title</title>
</head>
<body>
<form method="POST" action="#">
<pre><code id="extend" contenteditable="true">

<?php /* Some basic 5hit */

abstract class Elementary {

 protected $x;
 protected function __construct() {
 
  $this->x = 'value';  

 }

}

final class FinalClass extends Elementary {

 public function __construct(){
  parent::__construct();
 }

}

</code></pre>
<input type="hidden" id="carrier" name="complex" value="complexName">
<button type="submit" name="store">Go</button>
</form>
</body>
</html>
 


No, nemoj da se akaš ni da gubiš vreme, jer to što ja hoću 100% sam siguran da ne može.
Pretražio sam pola neta pre nego što sam postavio temu..
nije problem što ne može, tu je .js i dalje, najobičniji php strip_tags() na jednom mestu makne sve span tagove što .js ostavi,
jednostavno je glupo što je css takav, da može komplikovanije stvari, a ne ovako nešto.

Dakle, kao što se kod ofarba ovde, na ES-u (znam da iza stoje dodatni span tagovi kada se wrapuje u code) ili bilo gde, gde može da se ostavi kod,
isto to i css da odradi - samostalno - bez javaskripte, bez html inline wrappera..
Može tranzicije i animacije da vrti i tako to.. a ne može najobičniju boju da izgađa na određenu ključnu reč.
Nema logike.

[Ovu poruku je menjao plus_minus dana 06.03.2014. u 17:50 GMT+1]
about:networking
 
Odgovor na temu

Zeberdee
Misel Tekinder
Freelance Web Designer/Front-End
Developer
Niš

Član broj: 177025
Poruke: 59

Sajt: www.behance.net/MiselTeki..


+4 Profil

icon Re: Css i pseudo zjbncje08.03.2014. u 10:06 - pre 123 meseci
Citat:
plus_minus: I to isto dobiješ i sa najobičnijim razmakom...
i isto tako si automatski pružio bolju podršku i za starije pretraživače..
i isto neće da dira pre nego samo code.

Hvala na zalaganju, btw, ali ne trebaju meni časovi iz css-a..


Nema na cemu, takodje ...
 
Odgovor na temu

[es] :: Web dizajn i CSS :: Css i pseudo zjbncje

[ Pregleda: 1917 | Odgovora: 5 ] > FB > Twit

Postavi temu Odgovori

Navigacija
Lista poslednjih: 16, 32, 64, 128 poruka.