nl.hideout-lastation.com
Paradijs Voor Ontwerpers En Ontwikkelaars


IcoFont geeft u 2100+ gratis pictogrammen in één bestand met enkele lettertypen

Met de opkomst van weblettertypen en CSS-lettertypen die kunnen worden ingesloten, is het tegenwoordig veel gemakkelijker om werkelijk unieke websites helemaal opnieuw te maken.

De nieuwste trend zijn pictogramlettertypen die meestal kleiner zijn dan afbeeldingen, veel eenvoudiger te schalen en ze zijn glashelder op alle schermformaten (inclusief retina). Je kunt veel van deze pictogramlettertypen online vinden, maar IcoFont neemt echt de kroon .

Dit gratis pictogramlettertype wordt geleverd met meer dan 2.100 pictogrammen, allemaal samengebundeld in een enkel lettertypebestand .

U kunt de onbewerkte bron downloaden met alle pictogrammen of alleen bepaalde pictogram-families, zoals valuta, zakelijke, sociale of mobiele gebruikersinterface (onder vele anderen).

De website fungeert als een online documentatie voor al deze pictogrammen, dus u kunt de codes snel naar uw site kopiëren en plakken. IcoFont-pictogrammen lijken veel op FontAwesome-pictogrammen die bijvoorbeeld standaard in het Bootstrap-framework worden gebruikt.

Alles werkt via het element waarvoor twee CSS-klassen nodig zijn :

  1. de standaard IcoFont-klasse
  2. een klasse voor elk type pictogram

Als u bijvoorbeeld een kasteelpictogram wilt toevoegen aan uw document, voegt u zoiets toe aan uw lay-out:

U kunt deze pictogrammen technisch toevoegen aan elk gewenst element, maar de standaardcode van IcoFont is afhankelijk van elementen.

Merk op dat deze bibliotheek niet verward moet worden met een programma genaamd Icofont dat helemaal geen bibliotheek is, maar een interface voor het beheren van pictogramlettertypen in uw RoR-toepassingen. Omdat dit programma dezelfde naam heeft als de IcoFont-bibliotheek, kan het moeilijk zijn om te Googelen voor meer informatie.

Deze bibliotheek is nog steeds erg nieuw en ik kan deze niet vinden op GitHub of elders op internet. Maar als u op zoek bent naar meer informatie, raad ik u ten zeerste aan de website te bezoeken en een exemplaar te downloaden. U vindt hier alle juiste broncode en u kunt zelfs door alle pictogrammen bladeren op categorie om te zien wat er in de set staat.

Hoe HTML5 te gebruiken 
<picture>  Element om een ​​responsieve afbeelding te bereiken

Hoe HTML5 te gebruiken Element om een ​​responsieve afbeelding te bereiken

Responsive Design is misschien aanwezig, maar er zijn veel zaken die moeten worden aangepakt als het gaat om het responsief maken van afbeeldingen . Hoewel responsieve afbeeldingen zichzelf automatisch aanpassen aan de viewport-grootte (wat technisch eenvoudig is), is het probleem waarmee gebruikers worden geconfronteerd dat het beeldvocaal nauwelijks zichtbaar wordt wanneer het beeld te klein wordt

(Technische en ontwerptips)

De ware verhalen achter 10 populaire memes

De ware verhalen achter 10 populaire memes

Een vriend die ik ken, houdt ervan de foto's van zijn vrienden in memes te veranderen. Hij bladert door de Facebook-fotoalbums van zijn vrienden en selecteert zeer ongelukkige, openhartige gezichten om te gebruiken, voegt wat tekst toe en laat het vervolgens aan zijn nietsvermoedende vrienden ontketenen

(Technische en ontwerptips)