반응형
HTML 이미지 조정 vs CSS
결론부터 말하면 HTML 내부 요소 안에서의 정보가 CSS 정보보다 우선한다.
예시
<!DOCTYPE html>
<html>
<head>
<style>
img{
width:50%;
height:50%;
}
</style>
</head>
<body>
<h1>This part is HTMl</h1>
<p><img src="eximage.jpg" alt="fish" style="width:150px; height:200px; float:left">
This image will float to the left of the text</p>
<hr>
<h1>This part is CSS</h1>
<p><img src="eximage.jpg" alt="fish" style="width:15; height:10; float:left">
compare a picture</p>
</body>
</html>위의 코드를 보면 HTML 부분의 요소들 즉 이미지는 위의 <head>부분의 <style>영향을 받지 않는다.
하지만 CSS부분에서는 위의 <style>부분의 영향을 받는 것을 볼 수 있다.
즉 결론적으로 내부의 요소들이 우선이며 그 다음 CSS부분에따라 이미지의 크기,너비 설정이 달라진다.
반응형
'웹프로그래밍 > HTML' 카테고리의 다른 글
| HTML Headings 수직선 입력 방법 (0) | 2023.09.04 |
|---|---|
| HTML 테이블,셀 사용법 <table>, <th>,<td>, <tr> (0) | 2023.09.04 |
| HTML 속성(예제코드) (0) | 2023.09.03 |
| HTML Links 링크 이미지, 주소 넣기 (0) | 2023.09.03 |
| HTML Styles - CSS (0) | 2023.09.03 |
댓글