Pure CSS: puurste CSS Framework van Yahoo!

Zoals u weet, is het niet de geboortetijd van internet en zijn mensen websites bijna vergeten, met tekst in één alinea en enkele hyperlinks. Als u verder wilt gaan met de huidige webstandaarden, moet u uw website plezierig maken in plaats van eerlijk zichtbaar. Ongeacht de codeertaal zoals: HTML or PHP gebruikt voor het bouwen van de gebruikersinterface, CSS zal uw hulpmiddel zijn om de webpagina er stijlvol uit te laten zien. Wanneer we een webpagina vergelijken met een menselijk lichaam, werkt HTML als je botten, terwijl CSS iets is dat dicht bij huid en spieren ligt, gemaakt om vorm en structuur te geven.

Net als alle andere dingen in de wereld van ontwerp en ontwikkeling, heeft CSS ook kleine en grote updates gekregen waardoor het geschikt is om CSS3 te bereiken, wat het beste paar is wanneer HTML5 de reis vergezelt. De ster van het spel is echter de CSS-trend of -patroon dat u kiest om te gebruiken! Zoals u weet, zijn er verschillende CSS-frameworks voor u beschikbaar met verschillende looks en functies, zoals: Bootstrap, ZURB enz. Wat we vandaag aan u voorstellen is: Puur css, een eenvoudig coolgrid-gebaseerd CSS Framework van Yahoo!, de toonaangevende internetgigant. Gelukkig kun je dit framework gebruiken zonder ook maar een cent te betalen.

Puur css

Je hebt misschien andere frameworks zoals Zurb Foundation gebruikt voor het bouwen van aantrekkelijke webpagina's en websites. Het gebruik van CSS-framework is erg handig omdat u sjablonen kunt krijgen voor verschillende elementen op de pagina, zoals divisies, formulieren, menu's enz. Dit is dezelfde functie van Pure CSS door Yahoo! In plaats van bestanden te downloaden en toe te voegen aan de map 'CSS', kan Pure CSS werken als: Google Fonts, waar u een enkele regel code moet toevoegen om het framework in HTML te integreren. Omdat het framework de nieuwste is, is het volledig responsive. Bovendien is Pure CSS een van de eenvoudigste frameworks die je op internet kunt vinden. U kunt het framework gebruiken om uw website van stroom te voorzien of specifieke modules downloaden voor het stylen van secties zoals formulieren, menu's enz. Er zijn zes afzonderlijke modules gratis beschikbaar. Modules van Pure CSS zijn als volgt, die licht lijken te zijn (minder dan 2 Kb) wanneer ze worden geëxtraheerd.

• Baseren: Basiswebpagina-elementen zoals koppen, alinea's, typografie
• Knoppen: Verschillende knoppen met effecten zoals actief, op hover etc.
• tabellen: Basistafels verkrijgbaar met rand etc.
• menu's: Horizontaal, Verticaal, Vervolgkeuzelijst.
• grids: Responsieve rasters.
• formulieren: Gegroepeerde invoer, meerdere kolommen enz.

ZIE OOK: Subtiele patronen Bookmarklet: voorbeeld van achtergrondpatronen op uw website.

Waarom pure CSS gebruiken?

• Minder ongebruikte code: Het is heel gebruikelijk dat u een groot aantal niet-gebruikte code kunt zien wanneer u andere css-frameworks gebruikt. Aan de andere kant, in het geval van Pure CSS, zul je dit probleem nooit tegenkomen, omdat je de specifieke versie van het framework kunt gebruiken en het kunt gebruiken voor het stylen van specifieke delen van de webpagina. Minder code lijkt natuurlijk zelfs geweldig!
• Allemaal binnen: In ieder geval in sommige andere frameworks gebruiken ze JavaScript-plug-ins en codes van derden om de visuele impact te verbeteren. Pure CSS gebruikt echter geen enkele vorm van JS-plug-ins, met uitzondering van het geval van degene die wordt gebruikt in het drop-down-effect. Minder code van derden kan ervoor zorgen dat pagina's sneller worden geladen en dat de code overzichtelijk is.
• Sjablonen: Als u geen expert bent in het ontwerpen van uw eigen lay-out voor uw website, kan Pure CSS u daarbij helpen. De website bevat een aantal lay-outvoorbeelden, bijpassende websites met verschillende intenties zoals marketing, landingspagina etc.



• Huidbouwer: Als de sjablonen en stijlen de creatieve ontwerper in jou tevreden kunnen stellen, kun je de skinbuilder van Pure CSS gebruiken om je eigen skin te bouwen. Zoals u kunt raden, houdt de skinbuilder geen rekening met uw coderingsniveau-expertise.



ZIE OOK: Pictogramlettertypen: voor- en nadelen van de Font Awesome Generator.

Pure CSS gebruiken

Zoals eerder gespecificeerd heeft Pure CSS veel gunstige eigenschappen in vergelijking met andere frameworks. Herinnerend aan wat we eerder zeiden, kunt u Pure CSS gebruiken via dezelfde methode als Google Fonts. U moet een enkele regel externe bestandslink toevoegen om stijl aan uw webpagina te geven. Deze functie is erg handig als je webpagina's met één bestand moet bouwen en als je niet genoeg ruimte hebt om alle CSS-bestanden te plaatsen (denk dat dit nooit zal gebeuren). Als Yahoo! draait aan het stuur van het project project, u wilt niet gespannen raken over laadfouten of technische storingen.

Als u de volledige CSS-sjablonen van Pure CSS wilt gebruiken, kunt u de volgende code toevoegen aan de hoofdwebpagina. U kunt ook op de CSS-bestandslink klikken en het CSS-bestand downloaden om het te gebruiken.

[Html]

[/ Html]

Als u alleen gebruik wilt maken van specifieke CSS-versies zoals menu's, formulieren enz., zijn er speciale codes beschikbaar naast speciale CSS-bestanden. De lijst met URL's is als volgt:



Het gebruik van de skinbuilder van Pure CSS is ook een eenvoudigere taak omdat u de eigenschappen van elementen kunt regelen met behulp van intuïtieve bedieningsknoppen van de skinbuilder-pagina. We raden u echter aan de CSS-bestanden te downloaden om de namen van de elementen te begrijpen. Zoals we al zeiden, zal het plaatsen van deze bestanden van minder dan 2 Kb uw schijfruimte niet in beslag nemen.

De website van Pure CSS is zo opgezet dat zelfs een newbie op Pure CSS gebaseerde elementen in hun websites kan invoegen. U kunt een eenvoudige zijbalk aan de linkerkant zien, met een lijst van secties zoals formulieren, knoppen enz. Op elke pagina zijn voorbeelden beschikbaar samen met HTML-code om dat effect in uw website te brengen. Daarom is het heel eenvoudig om dergelijke elementen in uw webpagina in te voegen. Hieronder wordt het voorbeeld en de code weergegeven van een formulier met één inlogtype.



Conclusie

Bij het analyseren van alle functies van Pure CSS is dit een van de optimale bijdragen van Yahoo! wereld te ontwerpen. Yahoo! Gebruikersinterface, algemeen bekend als YUI, ondersteunt alle strings die aan Pure CSS zijn gekoppeld, waardoor het raamwerk het beste is als er een vergelijking is. Naast het gebruik van vooraf ingestelde elementen, kunt u Pure CSS ook aanpassen. Je moet jezelf naar de Pure CSS-website leiden om meer te weten te komen over het eenvoudig compacte framework. Laat ons uw mening over dit raamwerk weten nadat u voorbeelden heeft bekeken en het in uw project heeft gebruikt.