BraveCLHTML-afbeeldingscode maken op de Mac
Maak HTML-afbeeldingstags met ingesloten Base64-gegevens en beschrijvende alt-tekst voor meerdere afbeeldingen.
- Het resultaat
- Een gereedstaande HTML-set met drie afbeeldingstags met ingesloten gegevens-URI’s en beschrijvende alt-tekst, beschikbaar als volledig resultaat om te kopiëren of uit te voeren.
- Wat je nodig hebt
- Image Base64 Encoder geïnstalleerd op de Mac
- De ingebouwde voorbeeldafbeeldingen of je eigen PNG- of JPEG-bestanden
Image Base64 Encoder bundelt meerdere afbeeldingen in zelfstandige HTML-codefragmenten. Begin met de ingebouwde voorbeelden om te zien hoe een afbeeldingsset en de bijbehorende beschrijvingen werken.
1.Laad de voorbeeldafbeeldingen
Kies Try Samples (voorbeelden proberen) om de meegeleverde PNG- en JPEG-voorbeelden te laden. De lijst Sources (bronnen) toont Checkout-Badge.png, Developer-Workspace.jpg en Circuit-Board.jpg. De weergave Image (afbeelding) toont een voorbeeld van de gecodeerde gegevens-URI voor het geselecteerde bestand.
Image Base64 Encoder op de Mac met drie geladen PNG- en JPEG-voorbeelden en een voorbeeld van een gecodeerde Data URI 2.Maak de HTML-afbeeldingsset
Kies Set (set) boven het voorbeeld en laat HTML geselecteerd als uitvoerformaat. Selecteer elk item in Sources (bronnen) en vul zinvolle alternatieve tekst in bij Description (beschrijving). Laat Decorative image (decoratieve afbeelding) uit staan, zodat elke beschrijving een alt-attribuut wordt. Controleer of Set Readiness (gereedheid van de set) aangeeft dat de set klaar is. Bekijk daarna de drie afzonderlijke HTML-bijdragen en het gecombineerde voorbeeld van snippets.html. Het voorbeeld kan worden ingekort, maar Copy (kopiëren) en Deliver (uitvoeren) gebruiken het volledige resultaat.
Image Base64 Encoder met de gereedstaande HTML-afbeeldingsset, drie afzonderlijke codefragmenten en beschrijvende alt-tekst in HTML-afbeeldingstags
Tips
Vergelijk via de tabbladen Image en Set de gegevens-URI van één afbeelding met de gecombineerde HTML-uitvoer.
Elke beschrijving wordt de alt-tekst van de bijbehorende afbeelding als Decorative image uit staat.
Bij lange Base64-inhoud kan het voorbeeld worden ingekort; Copy en Deliver gebruiken het volledige resultaat.
Let opIngesloten Base64-afbeeldingsgegevens kunnen HTML veel groter maken. Controleer de weergegeven kopieergrootte voordat je de uitvoer deelt of insluit.
