일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | ||
6 | 7 | 8 | 9 | 10 | 11 | 12 |
13 | 14 | 15 | 16 | 17 | 18 | 19 |
20 | 21 | 22 | 23 | 24 | 25 | 26 |
27 | 28 | 29 | 30 |
Tags
- HTML
- FOR문
- 메뉴바만들기
- module.css
- 리액트
- JavaScript
- 미세먼지알림사이트만들기
- 개발일지
- useState
- 아코디언카드만들기
- 공공데이터 활용
- 자바스크립트
- 퍼블리싱
- css속성
- JS
- open api
- css 속성
- jQuery
- CSS
- Js 내장객체
- 바닐라자바스크립트
- 자바스크립트 내장객체
- 미세먼지
- 20231221
- 공공데이터
- 일러스트 입체글자
- 제이쿼리
- Illustrator2022
- position
- react
Archives
- Today
- Total
김코드의 웹디자인 세상
❏Markdown - README.md 속 이미지 크기 변경 및 정렬 방법 본문
안녕하세요!
오늘은 Markdown작성 중 이미지 크기 변경과 이미지 정렬 방법에 대해서 알아보겠습니다!
✎ 이미지크기 변경방법
먼저 이미지 크기를 변경하기 전 변경이 가능한 코드인지 아닌지 확인해야 합니다.
보통 마크다운에서 일반적으로 이미지를 첨부하면 아래와 같이 코드가 뜹니다.
하지만 이 방식은 이미지 사이즈를 조절하기에는 어려움이 있습니다.

기존 코드를 변경해주어야 하는데요!
앞을 <img> 태그로 수정 후 뒤에 넣고 싶은 width나 height를 작성하여 크기를 조절합니다.
<img src = "https://user-images.githubusercontent.com/115243471/230114751-
65af8f30-67c0-48ac-833b-70fd1a9d4581.png" width = "400px" height="400px">
단위는 px, % 사용하고 싶은 단위를 넣으신 후 이미지 크기를 조절하시면 됩니다.
✎ 이미지 정렬방법
준비된 <img> 태그 앞에 <p> 태그로 감싸줍니다. 그 후 align속성을 사용하여 정렬하고 싶은 방향으로 정렬합니다.
<p align = "center"> // right 오른쪽, left 왼쪽(기본값)
<img src = "https://user-images.githubusercontent.com/115243471/230114751-
65af8f30-67c0-48ac-833b-70fd1a9d4581.png" width = "400px" height="400px">
</p>
오늘도 좋은 하루 보내세요!!
◖⚆ᴥ⚆◗
'⊹⠀ 𝚐𝚒𝚝 , 𝚐𝚒𝚝𝚑𝚞𝚋' 카테고리의 다른 글
❏ Git - 유저네임, 이메일 확인 및 변경방법! (0) | 2022.12.29 |
---|---|
❏ GitHub - 나만의 웹페이지 오픈하기! (0) | 2022.12.03 |
❏ GitHub - 깃허브 시작하기! (0) | 2022.10.25 |
Comments