방법1 - img 자체 이용img 요소를 display:block 속성 이용해 블럭 요소로 만들고, margin 좌우를 auto 주면 됨.
<style> img { display: block; margin-left: auto; margin-right: auto; } </style> <div> <img src="https://homzzang.com/data/logo-planner/1993870266_2ba60bdc_spelling.png" alt="homzzang"> </div> 결과 보기
<style>
img {
display: block;
margin-left: auto;
margin-right: auto;
}
</style>
<div>
<img src="https://homzzang.com/data/logo-planner/1993870266_2ba60bdc_spelling.png" alt="homzzang">
</div>
결과 보기
방법2 - 부모 요소 이용바로 위 부모 요소에 text-align:center 속성 주면 됨.
<style> div { text-align:center; } </style> <div> <img src="https://homzzang.com/data/logo-planner/1993870266_2ba60bdc_spelling.png" alt="homzzang"> </div> 결과 보기
div {
text-align:center;