Qiita 게시물로 장식하고 싶을 때 자주 사용하는 HTML 태그

아무래도 7note입니다. Markdown만으로는 대응할 수 없는 세세한 조정이 가능!



이미지가 너무 커지거나 색을 붙여 눈에 띄게 하고 싶을 때에 사용할 수 있는 태그나 CSS를 정리했습니다.
매일 투고하고 있다고 기억해 갑니다만, 잊을 것 같아서 메모의 김에에 투고합니다.

■ 이미지 크기 사용자 정의


<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/661092/hogehogehoge.png" width="200">

이미지의 크기를 변경합니다.
그대로라면 너무 크거나 사용하기 어려우므로 이미지의 가로폭을 지정합니다.
![sample.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/661092/hogehogehoge.png)
이 ( ) 안의 URL만 복사해 둡니다.

↓변경 전↓


↓변경 후↓


■ 문자에 색상 지정( <font color=""></font> )


<font color="red">赤文字</font>

もしくは16進数表記で

<font color="#ff0000">赤文字</font>

--견본-----------
빨간색 문자가 될거야.
------------------

■ 개행( <br> )


|朝|昼|夜|
|:--|:--|:--|
|おはよう<br>おっはー|こんにちは<br>こんちわ|こんばんわ|

--견본-----------


아침




좋은 아침
안녕하세요 안녕
안녕하세요


------------------

표 등 중에서 개행시키고 싶을 때 사용하는 경우가 많습니다.
일반 문장에서도 사용할 수 있어요!

■ 상쇄 문자(<s></s>)


<s>ここに消したい文字を入れると線が入る</s>

--견본-----------
여기에 지우고 싶은 문자를 넣으면 선이 들어간다
------------------

낡은 문자를 지우거나 말을 흐리고 싶을 때 편리.

덧붙여 : Markdown에서 ~~文字~~ 와 둘러싸는 것으로 할 수 있는 것 같네요. 드디어 <s></s> 로 썼습니다.

■ 일부만 숨기기( <!-- 지우려는 문자 --> )



이른바 코멘트 아웃이군요. 자신의 메모를 남겨두고 싶을 때 편리.
<!-- ここに消したい文字を入れる -->

--견본--(검증 도구나 소스를 표시하면 볼 수 있다)

↓여기

↑여기
------------------

요약



마크다운은 익숙해지면 편리하고 외형도 깨끗이 정돈해 줍니다만,
약간의 수정이나 미세 조정은 어렵기 때문에, 그런 때에 조금 html을 쓸 수 있으면 편리하네요.

오마마츠!



~ Qiita에서 매일 게시 중!! ~
【초보자용】HTML・CSS의 조금 테크 모임

좋은 웹페이지 즐겨찾기