CSS hjälper oss att kontrollera visningen av bilder i webbapplikationer. Centrering av bilder eller texter är en vanlig uppgift i CSS. För att centrera en bild måste vi ställa in värdet på marginal-vänster och marginal-höger till bil och gör det till ett blockelement genom att använda display: block; fast egendom.
Om bilden finns i div-elementet kan vi använda text-align: center; egenskap för att centrera bilden i div.
java returkommando
De element sägs vara ett inline-element som enkelt kan centreras genom att applicera text-align: center; egenskapen för CSS till det överordnade elementet som innehåller det.
Obs! Bilden kan inte centreras om bredden är inställd på 100 % (full bredd).
Vi kan använda stenografiegenskapen marginal och ställ in den på bil för att rikta in bilden i mitten, istället för att använda marginal-vänster och marginal-höger fast egendom.
Låt oss se hur du centrerar en bild genom att applicera text-align: center; egendom till dess överordnade element.
Exempel
I det här exemplet justerar vi bilderna med hjälp av text-align: center; fast egendom. Bilden finns i div-elementet.
vända strängen i java
div { border: 2px solid red; } img{ height: 300px; width: 300px; } #center { text-align: center; } <img src="//techcodeview.com/img/css-tutorial/36/how-center-images-css.webp"> Testa det nu Produktion
Exempel
Nu använder vi marginal-vänster: auto; margin-right: auto; och display: block; egenskaper för att rikta in bilden mot mitten.
body{ background-color: lightblue; } #image { display: block; margin-left: auto; margin-right: auto; border: 8px ridge blue; padding: 5px; } Testa det nu Produktion
ssis
