도움말:위키 문법/5단계 편집하기 (부분)

== 3. 사용자 정의 CSS ==
=== 인라인 스타일 ===
HTML 요소에 직접 스타일을 적용합니다.

==== div 요소 스타일링 ====
<pre>
<div style="
  background-color: #f0f0f0;
  border: 1px solid #ccc;
  padding: 15px;
  margin: 10px 0;
  border-radius: 5px;
">
내용을 여기에 작성합니다
</div>
</pre>

==== 글자 스타일링 ====
<pre>
<span style="
  color: #2196F3;
  font-weight: bold;
  text-decoration: underline;
">
강조된 텍스트
</span>
</pre>

=== 고급 레이아웃 ===
==== 플렉스박스 레이아웃 ====
<pre>
<div style="
  display: flex;
  justify-content: space-between;
  align-items: center;
">
  <div>왼쪽 내용</div>
  <div>오른쪽 내용</div>
</div>
</pre>

==== 그리드 레이아웃 ====
<pre>
<div style="
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
">
  <div>첫 번째 칸</div>
  <div>두 번째 칸</div>
  <div>세 번째 칸</div>
  <div>네 번째 칸</div>
</div>
</pre>