Om het verschil tussen CSS en HTML te begrijpen, moet je begrijpen wat CSS is en wat HTML is.
Vertaald uit het Engels betekent CSS “Cascading Style Sheets”. CSS is een technologie voor het beheren van het ontwerp van een webpagina. Het biedt veel opties voor het beschrijven van het uiterlijk van een pagina en stelt u ook in staat het uiterlijk aanzienlijk te vereenvoudigen HTML-pagina's door het ontwerp voor pagina-elementen over te zetten naar een CSS-bestand. Met CSS kunt u één ontwerp voor een onbeperkt aantal gebruiken HTML-elementen pagina's. Hierdoor kunt u het ontwerp op alle pagina's van de site wijzigen op alle pagina's die één ontwerpklasse gebruiken, en dit één keer per keer CSS-bestand, dit is erg handig als de site meer dan 50 pagina's heeft; u hoeft het ontwerp van het element in elk van deze niet te wijzigen.
Wat is het HTML? Vertaald uit het Engels betekent HTML “HyperText Markup Language”. Html is standaard taal markeringen HTML-documenten. Hypertext-opmaaktaal wordt rechtstreeks gebruikt om te structureren HTML-inhoud pagina's. Met zijn hulp kunt u tabellen maken, ontwerpen, ontwerpen maken voor teksten en hypertekstdocumenten.
HTML-pagina's zonder gebruik CSS complex en verwarrend worden, omdat het ontwerp voor elk element opnieuw wordt geschreven, waardoor het tekstvolume aanzienlijk toeneemt. Er is bijvoorbeeld een HTML-pagina die drie stukjes tekst bevat die identiek moeten worden opgemaakt (grootte, kleur), maar gebruik HTML-tags alle drie tegelijk ontwerpen is niet mogelijk, aangezien deze fragmenten binnen zijn verschillende plaatsen HTML-pagina's. Om dergelijke teksten op te maken, zal het nodig zijn om de code telkens voor elk fragment afzonderlijk te gebruiken.
Als we CSS gebruiken, maken we één keer een ontwerp voor de klasse, en vervolgens wijzen we deze klasse in de HTML-paginacode eenvoudigweg toe aan elk van de drie fragmenten. Nu ziet de HTML-code er minder omvangrijk uit, nietwaar? Door er maar één te veranderen CSS-element, kunnen we het ontwerp van alle pagina's van de site in één keer wijzigen. En er kunnen duizenden van deze pagina's zijn.

Zo ontdekte TheDifference.ru de volgende verschillen tussen HTML en CSS:

HTML is de taal waarin een webpagina wordt gemaakt. CSS is de technologie die het ontwerp van deze webpagina bepaalt.
Vanuit het oogpunt van paginaontwerp is CSS handiger dan het schrijven van het ontwerp in HTML, omdat Hiermee kunt u de grootte van de code aanzienlijk verkleinen en het ontwerp voor veel pagina's tegelijk instellen.

CSS3 wordt door makers van webpagina's gebruikt om kleuren, lettertypen, blokplaatsing en andere aspecten van het uiterlijk van die webpagina's te specificeren. Het belangrijkste doel van het ontwikkelen van CSS3 was om de beschrijving van de logische structuur van een webpagina te scheiden (wat wordt gedaan met met behulp van HTML of andere opmaaktalen) om het uiterlijk van die webpagina te beschrijven (die nu wordt geproduceerd met behulp van de formele taal CSS3). Deze scheiding kan de toegankelijkheid van documenten vergroten, zorgen voor meer flexibiliteit en controle over de presentatie ervan, en de complexiteit en herhaling van structurele inhoud verminderen. Bovendien maakt CSS3 het mogelijk dat hetzelfde document in verschillende stijlen of uitvoermethoden wordt gepresenteerd, zoals schermpresentatie, gedrukte presentatie, gesproken lezing (door een speciale spraakbrowser of schermlezer) of uitvoer door apparaten die braille gebruiken.

Vóór de komst van CSS3 werden webpagina's uitsluitend ontworpen met HTML, rechtstreeks binnen de documentinhoud. Met de komst van CSS3 werd het echter mogelijk om de inhoud en presentatie van een document fundamenteel te scheiden. Dankzij deze innovatie werd het mogelijk om eenvoudig één enkele ontwerpstijl toe te passen op een groot aantal vergelijkbare documenten, en dit ontwerp snel te wijzigen.

Voordelen:

Verschillende paginaontwerpen voor verschillende weergaveapparaten. Op een scherm zal het ontwerp bijvoorbeeld over een grote breedte ontworpen worden, tijdens het printen zal het menu niet getoond worden, maar op een PDA en mobiele telefoon zal het menu de inhoud volgen.

Het verminderen van de laadtijd van websitepagina's door regels voor gegevenspresentatie over te zetten naar afzonderlijk CSS-bestand. In dit geval downloadt de browser alleen de documentstructuur en de gegevens die op de pagina zijn opgeslagen, en wordt de weergave van die gegevens slechts één keer door de browser gedownload en in de cache opgeslagen.

Gemakkelijk om het ontwerp later te wijzigen. U hoeft niet elke pagina te bewerken; wijzig gewoon het CSS-bestand.

Extra ontwerpopties. Met bijvoorbeeld met behulp van CSS-layout kunt u een tekstblok maken dat rond de rest van de tekst loopt (bijvoorbeeld voor een menu) of ervoor zorgen dat het menu altijd zichtbaar is wanneer u door de pagina bladert.

Gebreken:

Verschillende lay-outweergaven in verschillende browsers (vooral oudere), die dezelfde CSS3-gegevens anders interpreteren.

In de praktijk is het vaak nodig om niet alleen één CSS-bestand te repareren, maar ook HTML-tags, die op een complexe en obscure manier gerelateerd zijn aan CSS3-selectors, wat soms het gebruiksgemak teniet doet enkele bestanden stijlen en verlengt de bewerkings- en testtijd aanzienlijk.

VerschillenCSS3:

nieuwe stijlen

pseudo-selectoren

animatie

canvas ondersteuning

transformatie

beheer van tag-inhoud

...en meer

2.2.3 Kort overzicht van de js-taal en de jQuery-bibliotheek

JavaScript

JavaScript is een prototype-georiënteerde script-programmeertaal. Het is een dialect van de ECMAScript-taal.

JavaScript wordt vaak gebruikt als ingebedde taal voor softwaretoegang naar applicatieobjecten. Het wordt het meest gebruikt in browsers als scripttaal om interactiviteit aan webpagina's toe te voegen.

Belangrijkste architectonische kenmerken: dynamisch typen, zwak typen, automatisch geheugenbeheer, prototypeprogrammering, functioneert als eersteklas objecten.

JavaScript is door vele talen beïnvloed en is ontwikkeld met als doel de taal vergelijkbaar te maken met Java, maar tegelijkertijd gemakkelijk te gebruiken voor niet-programmeurs. De JavaScript-taal is van geen enkel bedrijf of organisatie eigendom, waardoor deze verschilt van een aantal programmeertalen die bij webontwikkeling worden gebruikt.

De naam "JavaScript" is een geregistreerd handelsmerk Orakel Bedrijf.

Taalfuncties

JavaScript is een objectgeoriënteerde taal, maar de prototyping die in de taal wordt gebruikt, veroorzaakt verschillen in het werken met objecten in vergelijking met traditionele klassengeoriënteerde talen. Bovendien heeft JavaScript een aantal eigenschappen die inherent zijn aan functionele talen - functies als eersteklas objecten, objecten als lijsten, anonieme functies, sluitingen - die de taal extra flexibiliteit geven.

Ondanks dat de syntaxis vergelijkbaar is met C, vertoont JavaScript fundamentele verschillen met de C-taal:

objecten met de mogelijkheid tot introspectie

functioneert als eersteklas objecten

automatische typecasting

automatische afvalinzameling

De taal mist zulke nuttige dingen als:

Modulair systeem: JavaScript biedt niet de mogelijkheid om afhankelijkheden en scope-isolatie te beheren

Standaardbibliotheek: er is met name geen avoor het werken met het bestandssysteem, het beheren van I/O-streams of basistypen voor binaire gegevens

Standaardinterfaces voor webservers en databases

Een pakketbeheersysteem dat afhankelijkheden bijhoudt en deze automatisch installeert

Semantiek en syntaxis:

Syntaxis JavaScript-taal lijkt in veel opzichten op de syntaxis van C en Java, maar semantisch ligt de taal veel dichter bij Self, Smalltalk of zelfs Lisp

Alle ID's zijn hoofdlettergevoelig

Variabelenamen kunnen letters, onderstrepingstekens, dollartekens en Arabische cijfers bevatten.

Variabelenamen mogen niet met een getal beginnen

Om commentaar van één regel op te maken, wordt // gebruikt dat uit meerdere regels bestaat en dat inline commentaar begint met /* en eindigt met */

Taalstructuur:

Structureel kan JavaScript worden weergegeven als een combinatie van drie delen die duidelijk van elkaar te onderscheiden zijn:

Kernel (ECMAScript)

Browserobjectmodel (BOM)

Documentobjectmodel (DOM)

Als JavaScript wordt bekeken in niet-browseromgevingen, worden het browserobjectmodel en het documentobjectmodel mogelijk niet ondersteund.

Het Document Object Model wordt soms gezien als een afzonderlijke entiteit van JavaScript, wat consistent is met de definitie van de DOM als een taalonafhankelijke documentinterface. Een aantal auteurs is daarentegen van mening dat BOM en DOM nauw verwant zijn.

ECMAScript is geen browsertaal en definieert geen invoer- of uitvoermethoden. Het is eerder de basis voor het bouwen van scripttalen. De ECMAScript-specificatie beschrijft gegevenstypen, instructies, trefwoorden, gereserveerde woorden, operators, objecten, reguliere expressies, zonder de auteurs van afgeleide talen te beperken bij het uitbreiden ervan met nieuwe componenten.

Browserobjectmodel

Het browserobjectmodel is een browserspecifiek deel van de taal dat een laag vormt tussen de kernel en het documentobjectmodel. Hoofddoel objectmodel browser - beheert browservensters en zorgt voor hun interactie. Elk browservenster wordt weergegeven door een vensterobject, het centrale DOM-object. Browserobjectmodel op dit moment niet gestandaardiseerd, maar specificatie wordt ontwikkeld door WHATWG en W3C

Naast vensterbeheer bieden browsers doorgaans ondersteuning voor de volgende entiteiten als onderdeel van het browserobjectmodel:

Framebeheer

Ondersteunt vertraging bij het uitvoeren van code en vertragingslussen

Systeemdialogen

Het adres van de geopende pagina beheren

Browserinformatie beheren

Informatie over monitorinstellingen beheren

Beperkt beheer van de browsegeschiedenis

Ondersteuning voor HTTP-cookies

Documentobjectmodel

Het Document Object Model is een applicatieprogrammeerinterface voor HTML- en XML-documenten. Volgens de DOM kan een document (bijvoorbeeld een webpagina) worden weergegeven als een boom van objecten die een aantal eigenschappen hebben die verschillende manipulaties ermee mogelijk maken:

Knooppunten genereren en toevoegen

Knooppunten verkrijgen

Knooppunten veranderen

Verbindingen tussen knooppunten wijzigen

Knooppunten verwijderen.

jQuery - JavaScript-bibliotheek, dat zich richt op de interactie van JavaScript en HTML. De jQuery-bibliotheek helpt u eenvoudig toegang te krijgen tot elk DOM-element en toegang te krijgen tot attributen en inhoud DOM-elementen, manipuleer ze. De jQuery-bibliotheek biedt ook een handige API voor het werken met AJAX.

Mogelijkheden

Cross-browser CSS-selectie-engine Sizzle, omgezet in een afzonderlijk project

Doorkruisen van de DOM-boom, inclusief ondersteuning voor XPath als plug-in

Evenementen

Visuele effecten

AJAX-add-ons

JavaScript-plug-ins

Het werken met jQuery kan worden onderverdeeld in 2 soorten:

Een jQuery-object ophalen met de functie $(). Door er bijvoorbeeld een CSS-selector aan toe te voegen, kunt u een jQuery-object verkrijgen van alle HTML-elementen die onder het criterium vallen en er vervolgens mee werken met behulp van verschillende methoden van het jQuery-object. Als de methode geen waarde retourneert, retourneert deze een verwijzing naar het jQuery-object, waarmee u methodeaanroepen kunt koppelen volgens het concept van een vloeiende interface.

Het aanroepen van globale methoden op het $-object, bijvoorbeeld handige array-iterators.

Om het verschil tussen CSS en HTML te begrijpen, moet je begrijpen wat CSS is en wat HTML is.
Vertaald uit het Engels betekent CSS “Cascading Style Sheets”. CSS is een technologie voor het beheren van het ontwerp van een webpagina. Het biedt veel opties voor het beschrijven van het uiterlijk van een pagina, en het stelt u ook in staat het uiterlijk van een HTML-pagina aanzienlijk te vereenvoudigen door het ontwerp van pagina-elementen over te brengen naar een CSS-bestand. . CSS maakt het mogelijk om één ontwerp te gebruiken voor een onbeperkt aantal HTML-pagina-elementen. Hiermee kunt u het ontwerp op alle pagina's van de site wijzigen op alle pagina's die één klasse gebruiken voor ontwerp, door dit één keer te wijzigen in het CSS-bestand. Dit is erg handig als de site meer dan 50 pagina's heeft, u hoeft dit niet te wijzigen het ontwerp van het element in elk van hen.
Wat is het HTML? Vertaald uit het Engels betekent HTML “HyperText Markup Language”. HTML is de standaardtaal HTML-opmaak documenten. Hypertext-opmaaktaal wordt rechtstreeks gebruikt om de inhoud van een HTML-pagina te structureren. Met zijn hulp kunt u tabellen maken, ontwerpen, ontwerpen voor teksten maken, enz.
HTML-pagina's zonder gebruik CSS complex en verwarrend worden, omdat het ontwerp voor elk element opnieuw wordt geschreven, waardoor het tekstvolume aanzienlijk toeneemt. Er is bijvoorbeeld een HTML-pagina die drie delen tekst bevat die op dezelfde manier moeten worden opgemaakt (grootte, kleur), maar het is niet mogelijk om HTML-tags te gebruiken om ze alle drie tegelijk op te maken, omdat deze fragmenten zich op verschillende plaatsen op de HTML-pagina. Om dergelijke teksten op te maken, zal het nodig zijn om de code telkens voor elk fragment afzonderlijk te gebruiken.
Als we CSS gebruiken, maken we één keer een ontwerp voor de klasse, en vervolgens wijzen we deze klasse in de HTML-paginacode eenvoudigweg toe aan elk van de drie fragmenten. Nu ziet de HTML-code er minder omvangrijk uit, nietwaar? Door slechts één CSS-element te wijzigen, kunnen we het ontwerp van alle pagina's van de site in één keer wijzigen. En er kunnen duizenden van deze pagina's zijn.

Conclusie website

1. HTML is de taal waarin een webpagina wordt gemaakt. CSS is de technologie die het ontwerp van deze webpagina bepaalt.
2. Vanuit het oogpunt van paginaontwerp is CSS handiger dan het schrijven van het ontwerp in HTML, omdat Hiermee kunt u de grootte van de code aanzienlijk verkleinen en het ontwerp voor veel pagina's tegelijk instellen.

Waarin verschilt CSS van HTML?

Feit is dat html aanvankelijk uitsluitend werd gebruikt voor het markeren van de inhoud van het document. Die. met zijn hulp werd aangegeven dat dit een paragraaf is, en dit is een tabel, en dit is een afbeelding.

Wat gebeurde er daarna? Het aantal internetgebruikers groeide elke maand. Er werden steeds serieuzere ontwerpeisen gesteld, d.w.z. extern ontwerp pagina's. Al snel bedachten ontwikkelaars nieuwe tags, zoals , , en anderen, die niet langer de structuur bepaalden, maar verschijning. Er verschenen veel van dergelijke tags. En alles zou goed komen, MAAR! een groot deel van deze tags werd door slechts één type browser ondersteund. Een veel voorkomende gebeurtenis bij het bekijken van een bepaalde site is een foutmelding: “Je hebt browser X nodig om deze pagina te bekijken.” CSS is speciaal gemaakt om deze situatie te corrigeren. Het bood precisieontwerpmogelijkheden die door alle browsers werden ondersteund.