[html, css, js] met font tags :) #27

Index

» digital corner

» development

actieve topics nieuwe topics
abonnement Unibet Coolblue Bitvavo
  dinsdag 7 augustus 2012 @ 18:21:16 #101
377024 Quotidien
fetchez la vache
pi_115249426
quote:
2s.gif Op dinsdag 7 augustus 2012 18:03 schreef Tijn het volgende:

[..]

Het is geen grapje, hoor.
Weet ik. :)

Ik gebruik nu Notepad++, vindt die kleurtjes best handig. :')
Ik ben nie hier voor de pingpong te schpelen
pi_115249428
quote:
7s.gif Op dinsdag 7 augustus 2012 18:04 schreef n8n het volgende:
een goede editor zet alvast een } neer zodra je de { typt :@
Dat vind ik altijd hondsirritant, dat ik dan {} typ en er opeens {}} staat, en dat soort gezeik.
Of bij andere programmeerGUI's, dat je een nog niet gedeclareerde variabele gebruikt, op de spatie drukt, en hij opeens vervangen is door een variabele met een vergelijkbare naam.
pi_115249512
quote:
7s.gif Op dinsdag 7 augustus 2012 18:21 schreef Quotidien het volgende:

[..]

Weet ik. :)

Ik gebruik nu Notepad++, vindt die kleurtjes best handig. :')
Ik raad je ook aan om Sublime Text te proberen. Is echt het proberen waard :P
  dinsdag 7 augustus 2012 @ 18:25:15 #104
377024 Quotidien
fetchez la vache
pi_115249567
quote:
0s.gif Op dinsdag 7 augustus 2012 18:23 schreef robin007bond het volgende:

[..]

Ik raad je ook aan om Sublime Text te proberen. Is echt het proberen waard :P
Ziet er wel hip uit. Zal hem eens proberen. ;)
Ik ben nie hier voor de pingpong te schpelen
pi_115249993
quote:
7s.gif Op dinsdag 7 augustus 2012 18:25 schreef Quotidien het volgende:

[..]

Ziet er wel hip uit. Zal hem eens proberen. ;)
Dit ja :Y
  dinsdag 7 augustus 2012 @ 19:07:58 #106
377024 Quotidien
fetchez la vache
pi_115251638
Wellicht weer een domme vraag maar wat is hier fout aan?

1<div id="box1">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent porta adipiscing diam, quis porttitor sapien varius quis. Sed tincidunt mi et ligula aliquet eu euismod mauris egestas. Suspendisse potenti. Nunc vel diam ipsum, quis aliquam felis. Mauris vulputate arcu eu ipsum imperdiet lacinia. Sed vestibulum malesuada scelerisque. Etiam sed dui ipsum. </div>

1
2
3
4
5
6		#box1{
width: 750px;
height: 300px
border: 2px grey
Background: #C6CBCC
}

Edit: laat maar, ik was dus gewoon de ; steeds vergeten. o|O

[ Bericht 28% gewijzigd door Quotidien op 07-08-2012 19:22:10 ]
Ik ben nie hier voor de pingpong te schpelen
  dinsdag 7 augustus 2012 @ 19:09:33 #107
230788 n8n
Pragmatisch
pi_115251735
quote:
2s.gif Op dinsdag 7 augustus 2012 18:21 schreef kutkloon7 het volgende:

[..]

Dat vind ik altijd hondsirritant, dat ik dan {} typ en er opeens {}} staat, en dat soort gezeik.
Of bij andere programmeerGUI's, dat je een nog niet gedeclareerde variabele gebruikt, op de spatie drukt, en hij opeens vervangen is door een variabele met een vergelijkbare naam.
dat laatste is irritant, het eerste heb ik nooit last van omdat ik nu meteen op return druk na { waarmee ik meteen de regel indent
“Specialization is for insects”.—Robert Heinlein
pi_115252840
Bij NetBeans voegt hij ook automatisch } toe, maar als je die alsnog intoetst komt er geen dubbele, dat soort kleine dingetjes vind ik wel fijn :D
pi_115253168
quote:
7s.gif Op dinsdag 7 augustus 2012 19:07 schreef Quotidien het volgende:
Wellicht weer een domme vraag maar wat is hier fout aan?
[ code verwijderd ]

[ code verwijderd ]

Edit: laat maar, ik was dus gewoon de ; steeds vergeten. o|O
Als je daar erg consistent in bent komt dat erg van pas in andere programmeertalen. :P
quote:
0s.gif Op dinsdag 7 augustus 2012 19:27 schreef lkb9000 het volgende:
Bij NetBeans voegt hij ook automatisch } toe, maar als je die alsnog intoetst komt er geen dubbele, dat soort kleine dingetjes vind ik wel fijn :D
Hmm..
pi_115256259
quote:
2s.gif Op dinsdag 7 augustus 2012 08:55 schreef Tijn het volgende:

[..]

Het is vooral niet zo'n goed idee om de kleur in de naam van je klasse te zetten, want als je dan ooit een nieuwe kleur wil gebruiken, slaan je classnames nergens meer op.
Dat. Een class moet zo veel mogelijk functioneel beschrijvend zijn en zo min mogelijk het uiterlijk beschrijven.
fokstok.nl
pi_115265949
Ligt het aan de browsers hoe fonts worden weergegeven?

Zie bijv:

Beide hebben dezelfde font volgens de css. Maar toch zit er een klein verschil in de fonts, FireFox en IE. Aan de font grootte ligt het niet.

Overigens, gewoon Arial.

Edit: Geloof dat er ergens een font stond omgewisseld, de ene gaf hecevita (oid) weer en de andere arial. OpGESLOT

Edit2: zit toch nog enig verschil tussen.. Jammer

[ Bericht 4% gewijzigd door Snoepje5 op 07-08-2012 23:41:01 ]
pi_115269310
Helvetica ;)

Daarnaast zit er ook een verschil in hoe browsers fonts weergeven, maar meer qua antialiasing, niet veel aan te doen.

Grappig om die twee zo boven elkaar te zien, je ziet heel goed dat Arial net iets anders is maar exact dezelfde letterbreedte aanhoudt. Dat is ook het hele idee achter Arial, dat het verwisselbaar is met Helvetica zonder dat de tekst groter of kleiner wordt en zonder licentiekosten voor Helvetica te betalen :P
pi_115269449
Had het inderdaad opgemerkt.. Beetje vreemd dat er ergens helvetica eerst stond en elders arial eerst..

Inderdaad jammer dat browsers fonts anders weergeven. Gelukkig opera en firefox hetzelfde. Maar IE moet weer eens de rare eend in de bijt zijn.. kut IE. Maakt Arial wat smaller en bold wordt dikker dat het minder goed leesbaar is als bij opera en firefox.
pi_115287392
Is zoiets mogelijk in javascript?
foo() geeft 'foo'
foo().bar() geeft 'bar' (is dit überhaupt mogelijk?)
Foo is een functie en geen class.
  woensdag 8 augustus 2012 @ 14:04:42 #115
12221 Tijn
Powered by MS Paint
pi_115287621
JS heeft sowieso geen classes. En functies zijn objecten. Het is dus prima mogelijk dat foo een method heeft die 'bar' teruggeeft.

Dit werkt zoals jij omschrijft:

1
2
3
4
5
6
7
8
9
10		var foo = function(){
  return 'foo';
}

foo.bar = function(){
  return 'bar';
}

console.log(foo());
console.log(foo.bar());
Verberg de nieuwsticker
pi_115288071
In coffeescript heb je wel een class, maar dat is dus een 'wannabe' class. Maar foo().bar() kan dus niet? Ik heb namelijk de parameters van foo wel nodig.
  woensdag 8 augustus 2012 @ 14:16:00 #117
12221 Tijn
Powered by MS Paint
pi_115288133
'bar' returnen kan wel zo:

1
2
3
4
5
6
7		var foo = function(){
  return {
    bar: function(){
      return 'bar';
    }
  }
}
Verberg de nieuwsticker
  woensdag 8 augustus 2012 @ 14:16:56 #118
56176 Catch22-
Ben je Blind?!
pi_115288184
Less _O_ Winless _O_

CSS3 zonder LESS (Of Sass of een andere preprocessor) is gewoon _niet_ te doen
Heel veel groetjes, Catch22
En zoals mijn opa zei: "Al is het meisje nog zo mooi, haar poep stinkt ook". Rust Zacht opa..
Met GHB nooit meer nee
Storneren een optie?
pi_115288357
quote:
2s.gif Op woensdag 8 augustus 2012 14:16 schreef Tijn het volgende:
'bar' returnen kan wel zo:
[ code verwijderd ]

Maar nu werkt foo() niet meer. ;(
  woensdag 8 augustus 2012 @ 14:23:12 #120
230788 n8n
Pragmatisch
pi_115288500
quote:
11s.gif Op woensdag 8 augustus 2012 14:16 schreef Catch22- het volgende:
Less _O_ Winless _O_

CSS3 zonder LESS (Of Sass of een andere preprocessor) is gewoon _niet_ te doen
jawel, ga het wel gebruiken maar heb het vrijwel niet nodig
“Specialization is for insects”.—Robert Heinlein
  woensdag 8 augustus 2012 @ 14:23:23 #121
56176 Catch22-
Ben je Blind?!
pi_115288504
Less
1
2
3
4
5
6
7
8
9
10
11		.turnAnimation() {
      from { .transform3dAni(rotateY(0deg)); }      
      to {
          .transform3dAni(rotateY(180deg));
      }
}
    
@-webkit-keyframes turnAnimation { .turnAnimation; }
@-moz-keyframes turnAnimation { .turnAnimation; }
@-o-keyframes turnAnimation { .turnAnimation; }
@keyframes turnAnimation { .turnAnimation; }

CSS
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56		@-webkit-keyframes turnAnimation {
  from {
    -webkit-transform: rotatey(0deg);
    -moz-transform: rotatey(0deg);
    -o-transform: rotatey(0deg);
    transform: rotatey(0deg);
  }
  to {
    -webkit-transform: rotatey(180deg);
    -moz-transform: rotatey(180deg);
    -o-transform: rotatey(180deg);
    transform: rotatey(180deg);
  }
}
@-moz-keyframes turnAnimation {
  from {
    -webkit-transform: rotatey(0deg);
    -moz-transform: rotatey(0deg);
    -o-transform: rotatey(0deg);
    transform: rotatey(0deg);
  }
  to {
    -webkit-transform: rotatey(180deg);
    -moz-transform: rotatey(180deg);
    -o-transform: rotatey(180deg);
    transform: rotatey(180deg);
  }
}
@-o-keyframes turnAnimation {
  from {
    -webkit-transform: rotatey(0deg);
    -moz-transform: rotatey(0deg);
    -o-transform: rotatey(0deg);
    transform: rotatey(0deg);
  }
  to {
    -webkit-transform: rotatey(180deg);
    -moz-transform: rotatey(180deg);
    -o-transform: rotatey(180deg);
    transform: rotatey(180deg);
  }
}
@keyframes turnAnimation {
  from {
    -webkit-transform: rotatey(0deg);
    -moz-transform: rotatey(0deg);
    -o-transform: rotatey(0deg);
    transform: rotatey(0deg);
  }
  to {
    -webkit-transform: rotatey(180deg);
    -moz-transform: rotatey(180deg);
    -o-transform: rotatey(180deg);
    transform: rotatey(180deg);
  }
}
niet helemaal optimaal, maar het wordt wel geminimized door de parser dusja
Heel veel groetjes, Catch22
En zoals mijn opa zei: "Al is het meisje nog zo mooi, haar poep stinkt ook". Rust Zacht opa..
Met GHB nooit meer nee
Storneren een optie?
pi_115288537
quote:
11s.gif Op woensdag 8 augustus 2012 14:16 schreef Catch22- het volgende:
Less _O_ Winless _O_

CSS3 zonder LESS (Of Sass of een andere preprocessor) is gewoon _niet_ te doen
Is LESS zoiets als coffeescript, maar dan voor css en wordt gewoon lokaal (voor de developer) 'geconverteerd' en dan .css naar de client gestuurd of wordt het client-side geconverteerd?
  woensdag 8 augustus 2012 @ 14:25:51 #123
56176 Catch22-
Ben je Blind?!
pi_115288603
Kan je zelf voor kiezen.

Ik gebruik nu WinLESS, dat is een app die bij elke wijziging de outputcss bijwerkt, maar je hebt ook een versie voor .Net en Java die het parsed. Er is ook een javascript parser. Je kan dus zelf kiezen wat je wil.
Heel veel groetjes, Catch22
En zoals mijn opa zei: "Al is het meisje nog zo mooi, haar poep stinkt ook". Rust Zacht opa..
Met GHB nooit meer nee
Storneren een optie?
  woensdag 8 augustus 2012 @ 14:34:55 #124
230788 n8n
Pragmatisch
pi_115289038
http://prefixmycss.com ultrahandig

laat maar, er was ook een .js dat het in de browser deed zodat je enkel de css niet hoeft te updaten als een browser geen prefix meer nodig heeft
“Specialization is for insects”.—Robert Heinlein
  woensdag 8 augustus 2012 @ 14:43:53 #125
56176 Catch22-
Ben je Blind?!
pi_115289438
Als je LESS gebruikt kan je mixins schrijven die dit voor je doen. Je hebt bijvoorbeeld 3L (Lots of Love for Less), dat een soort toolbox is met allerlei tools/mixins voor LESS
Heel veel groetjes, Catch22
En zoals mijn opa zei: "Al is het meisje nog zo mooi, haar poep stinkt ook". Rust Zacht opa..
Met GHB nooit meer nee
Storneren een optie?
actieve topics nieuwe topics
abonnement Unibet Coolblue Bitvavo
[html, css, js] met font tags :) #27
Index

» digital corner

» development

Forum Opties
Forumhop:
Hop naar:
(afkorting, bv 'KLB')