텍스트 오른쪽에 이미지를 떠있는 방법을 배우는 데 관심이 있다면 상당히 간단한 작업임을 기쁘게 알 수 있습니다. 프로그래머가 웹 페이지의 이미지를 텍스트 내부에 표시하거나 주위를 감싸고있는 텍스트로 표시하려는 경우가 많이 있습니다. 고맙게도 이미지 조작은 텍스트 조작과 비슷하므로 후자에 대한 경험이있는 경우이 과정을 거치지 않아야합니다.
실제로 CSS float 속성을 사용하면 텍스트 오른쪽에 이미지를 떠 다니고 텍스트가 왼쪽 주위로 흐르게 할 수 있습니다. 방법을 배우려면 5 분짜리 튜토리얼을 사용하십시오.
시작하기
시작하려면 텍스트 단락을 작성하고 단락 시작 부분에 이미지를 추가하십시오. 이 작업은 텍스트 앞에 수행되어야하지만
꼬리표):
다음으로 이미지에 스타일 속성을 추가하고 float 속성을 적용합니다.
텍스트가 이미지에 대해 오른쪽 위로 치우치게되므로 이미지에 약간의 여백을 추가하여 읽기 쉽게 만듭니다.
여백 속기 속성은 위쪽, 오른쪽, 아래쪽 및 왼쪽 순서로 여백을 적용합니다 (TRBL). 그리고 그렇게합니다. 이제 이미지를 오른쪽으로 뜨는 것이 전혀 어렵지 않다는 것을 알 수 있습니다. 이미지를 왼쪽으로 뜨고 중앙에 놓아도됩니다. 불행히도 첫 번째 이동은 가능하지만 이미지를 가운데로 플로팅 할 수는 없습니다. 일반적으로 이미지의 중심은 2 열 레이아웃이어야하기 때문입니다.
마무리
