Jak wyrównać obraz do prawej w CSS

Jak wyrównać obraz do prawej w CSS
Obrazy są uważane za formularz wizualny do przekazywania wiadomości lub pomysłów w aplikacjach internetowych. Są jednak przydatne tylko wtedy, gdy są we właściwej pozycji. Czasami obrazy nie są na ich pozycji, a ich wyrównanie jest wymagane. Różne właściwości CSS mogą pomóc w wyrównaniu obrazów.

W tym artykule pokazano dwie metody wyrównania obrazu po prawej stronie w CSS.

Jak wyrównać obraz do prawej w CSS?

W CSS użyjemy następujących właściwości do wyrównania obrazu po prawej stronie:

  • Float Property
  • Wyświetlaj właściwość

Zacznijmy więc od pierwszej metody.

Metoda 1: Użyj właściwości Float, aby wyrównać obraz w prawo w CSS

CSS „platforma„Właściwość służy do kontrolowania pozycji elementu. Decyduje, czy element będzie unosił się po prawej, lewej stronie, czy nie w żaden sposób.

W przypadku demonstracji podamy przykład, aby zrozumieć działanie wspomnianej nieruchomości.

Przykład

Oto przykładowy obraz wyrównany domyślnie po lewej stronie. Zmienimy pozycję obrazu i wyrównamy go na prawą stronę:

Aby to zrobić, określ obraz SRC w Tag pliku HTML:

Aby wyrównać wybrany obraz po prawej stronie, ustawimy wartość „platforma„Nieruchomość jako„Prawidłowy”:

Po zapisaniu danego kodu otwórz plik HTML w przeglądarce, aby wyświetlić wynik:

Powyższe dane wyjściowe wskazało, że pomyślnie wyrównaliśmy obraz po prawej stronie za pomocą właściwości CSS Float.

Metoda 2: Użyj właściwości wyświetlacza, aby wyrównać obraz w prawo w CSS

W CSS „wyświetlacz”Własność określa zachowanie elementu. Określa, w jaki sposób element będzie działał w określonym miejscu. Możesz także użyć właściwości wyświetlacza, aby ustawić wyrównanie obrazu jako właściwe.

Spójrz na poniższy przykład, aby zobaczyć, jak możemy wyrównać obraz w prawo, wykorzystując właściwość CSS Display.

Przykład

Aby wyrównać obraz bezpośrednio w CSS, określamy „wyświetlacz„Wartość nieruchomości jako„-Webkit-box". Wartość -webkit -box służy do ustawienia zawartości dowolnego elementu w określonym kierunku. Co więcej, „margines lewic„Własność wybranego obrazu jest również ustawiona jako„automatyczny„Aby nadać lewej stronie część pozostałej przestrzeni:

Wyjście

Podaliśmy podstawowe instrukcje związane z wyrównaniem obrazów do prawej za pomocą właściwości CSS.

Wniosek

Aby wyrównać obraz po prawej stronie w CSS, możesz użyć „platforma" I "wyświetlacz" nieruchomości. Dla wspomnianego celu wartość właściwości pływakowej jest ustawiona jako odpowiednia, a wartość -webkit -box właściwości wyświetlania ustawia wyrównanie obrazu jako właściwe. W tym artykule opisano dwie najprostsze metody wyrównania obrazów w prawo w CSS. Obie metody są wydajne; Wykorzystaj którykolwiek z nich zgodnie z preferencjami.