이전 기사에서 나는 Bootstrap3 연구 노트의 그리드 시스템을 소개했습니다 (1)
타이틀의 경우 Bootstrap은 H1-H6의 스타일을 수정했습니다. 자막이 필요한 경우 작은 태그를 사용할 수도 있습니다.
<H1> H1. 부트 스트랩 제목 <Small> 2 차 텍스트 </small> </h1> <h2> h2. 부트 스트랩 제목 <Small> 2 차 텍스트 </small> </h2> <h3> H3. 부트 스트랩 제목 <Small> 2 차 텍스트 </small> </h3> <H4> H4. 부트 스트랩 제목 <Small> 2 차 텍스트 </small> </h4> <h5> h5. 부트 스트랩 제목 <Small> 2 차 텍스트 </small> </h5> <h6>
페이지에 고유 해야하는 H1이있는 경우 "Page-Header"로 스타일링 된 DIV에 포함시킬 수 있습니다.
<div> <h1> 트위터 부트 스트랩 <Small> 직관적 인 프론트 엔드 프레임 워크 </small> </h1> </div>
부트 스트랩 기본 글꼴 크기는 14px, 선 높이는 1.428, 단락 간격은 10px입니다. 단락이 더 눈길을 끄는 경우 '리드'클래스가 있습니다.
텍스트* 클래스를 사용하면 텍스트의 수평 정렬을 쉽게 설정할 수 있습니다.
<p> 왼쪽 정렬 된 텍스트. </p> <p> 센터 정렬 된 텍스트.
HTML의 텍스트 형식 태그는 부트 스트랩에서 사용할 수 있습니다.
<p> <b> 이것은 대담한 텍스트입니다 </b> </p> <p> <p> <p> <p> <p> <big> 이것은 큰 텍스트입니다 </big> </p> <p> <code> 이것은 컴퓨터 코드입니다 </code> </p> <p> <em> 이것은 강조된 텍스트입니다 </p> <p> <i> 이것은 이탈리아 텍스트입니다 </i> <p> <p> <p> <p> <p> <p> <p> <p> <p> 텍스트 </mark> </p> <p> <small> 이것은 작은 텍스트입니다. 이것은 작은 텍스트입니다 </small> </p> <p> <strong> 이것은 텍스트 </strong> </p> <p>이 </sub> superscript </sup> </p> <p> <ins>이 텍스트에서 </p> <delet is the thisted is the the the the the the the the indest inde ind ind insepted </sup> <p> <ins> 이것은 강조 된 텍스트입니다. 문서 </del> </p>
문자 형식 변환 클래스는 필요한 변환을 잘 수행 할 수 있습니다.
<p> 빠른 갈색 여우가 게으른 개를 뛰어 넘습니다. </p> <p> 빠른 갈색 여우가 게으른 개를 뛰어 넘습니다. </p> <p> 빠른 갈색 여우가 게으른 개를 뛰어 넘습니다. </p>
색상은 콘텐츠의 중요성을 전달하는 강력한 방법이며 Bootstrap은 편리한 세트 텍스트 강조 클래스를 제공합니다.
<p> Muted :이 텍스트가 회색으로 나갔습니다. </p> <p> 중요 : 진행하기 전에 지침을주의 깊게 읽으십시오. </p> <p> 성공 : 메시지가 성공적으로 전송되었습니다. </p> <p> 참고 : 가입 프로세스를 완료하려면 이용 약관에 동의해야합니다. </p> <p> 경고 : 네트워크 연결에 문제가있었습니다.
인용도 수정되었습니다.
<blockquote> <p> 세상은 살기 좋은 곳입니다. 악한 사람들이 아니라 그것에 대해 아무것도하지 않는 사람들 때문에. </p> <small> <cite> albert einstein </cite> </small> </blockquote>
수업은 올바른 정렬 참조를위한 것입니다.
위의 것은 Bootstrap3 연구 노트의 레이아웃에 대한 관련 지식 (ii) 편집자가 소개합니다. 나는 그것이 당신에게 도움이되기를 바랍니다. 궁금한 점이 있으면 메시지를 남겨 주시면 편집자가 제 시간에 답장을 드리겠습니다. Wulin.com 웹 사이트를 지원해 주셔서 대단히 감사합니다!