VSCode_부트스트랩. 타이포그래피 2
주소
<h4 class="text-info">7. 주소는 address 태그를 사용합니다.</h4>
<address>
<strong>이름: 홍길동</strong> <br> 주소:서울시 종로구 <br> 전화번호
:010-1234-5678 <br>
</address>
인용구
<h4 class="text-info">8. 인용구는 blockquote 태그를 이용하며 오른쪽 정렬도 가능합니다.
</h4>
<blockquote>
현재까지 쓰인 CSS 속성은 부트 스트랩 웹 사이트에서도 동일하게 설명이 되어 있습니다. <small>CSS
속성 <cite>http://bootstrapk.com/BS3/css</cite>
</small>
</blockquote>
<blockquote class="pull-right">
인용구에 class="pull-right"를 적용해 주면 오른쪽으로 정렬됩니다. <small>CSS 속성 <cite>http://bootstrapk.com/BS3/css</cite></small>
</blockquote>
<div class="clearfix"></div>
목록
<h4 class="text-info">9. 목록(list)를 표시할때는 ul , ol, dt 태그를 사용합니다.</h4>
<ul>
<li>일반적인 목록인 경우 ul과 li를 이용합니다.</li>
<li>이 경우 기본적으로 왼쪽에 20px 하단으로 10px의 여백이 생깁니다.</li>
</ul>
<ol>
<li>리스트의 숫자를 표시 할 때는 l, li 태그틑 사용합니다</li>
<li>이 경우에도 왼쪽에 20px 하단으로 10px의 여백이 생깁니다.</li>
</ol>
리스트-언스타일드
<ul class="list-unstyled">
<li>여기는 ul 또는 ol 태그에 class="list-unstyled"를 적용한
부분입니다.list-unstyled 클래스 선택자를 사용하면 왼쪽 20px 여백이 0으로 바뀝니다.</li>
<li>상단에 있는 ul과 ol 태그가 적용된 부분을 확인해 보세요.
<ul>
<li>목록 내부에 다시 ul 태그를 사용하면 원래의 ul 또는 ol 값과 동일한 결과를 얻을 수 있습니다.</li>
<li>상단의 ul 과 비교해 보시기 바랍니다.</li>
</ul>
</li>
<li>반드시 소스 파일을 확인해 보시기 바랍니다.</li>
</ul>
리스트-인라인
<ul class="list-inline">
<li>ul에 class="list-inline" 을 적용하면</li>
<li>목록이 세로에서 가로로 펼쳐집니다.</li>
<li>각 li 사이는 오른쪽과 왼쪽으로 5픽셀의 패딩값이 적용됩니다.</li>
</ul>
<dl>
<dt>HTML</dt>
<dd>Hyper Text Markup Language</dd>
<dt>CSS</dt>
<dd>Cascading Style Sheet</dd>
<dt>bootstrap</dt>
<dd>Twitter에서 만든 웹 사이트 제작용 프레임워크</dd>
</dl>
Author And Source
이 문제에 관하여(VSCode_부트스트랩. 타이포그래피 2), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://velog.io/@nugoory20/VSCode부트스트랩.-타이포그래피-2저자 귀속: 원작자 정보가 원작자 URL에 포함되어 있으며 저작권은 원작자 소유입니다.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)