부트 3 및 부트 4

본문에서 우리는 프레임의 Bootstrap 3과 Bootstrap 4 버전을 비교하고 비교할 것이다.

안내란?

Bootstrap은 가장 광범위하게 사용되는 HTML, CSS, 자바스크립트 프레임워크로 이동이 편리하고 응답이 빠른 사이트를 만드는 데 사용된다.그것은 웹 개발을 더욱 쉽고 빠르게 하는 전방 프레임워크이다.Bootstrap은 무료로 다운로드 및 사용할 수 있습니다.빠른 응답을 하는 사이트는 스마트폰과 데스크톱 컴퓨터를 포함한 모든 장치에서 좋은 외관을 유지할 수 있도록 자신을 바꿀 수 있다.

리드 3이란?

Bootstrap 3은 Bootstrap 프레임의 최신 버전입니다.그것은 무료로 다운로드하고 사용할 수 있다.Bootstrap 3은 캐스케이드 스타일 시트와 마찬가지로 HTML 텍스트에 디자인을 추가하는 데 사용됩니다.그것은 이동 우선 설계를 사용하도록 장려한다.
Bootstrap 3 격자 시스템은 xs, sm, md와 lg를 포함하지만 Bootstrap 4 격자 시스템은 5층이 있다.Bootstrap 3에서 CSS 셀은 px입니다.반 전체 학생.이 예에서 img responsive는 응답 이미지를 만드는 데 사용되지만 Bootstrap 4에서 이 기능이 변경되었습니다.부트 3은 다크 또는 반전 테이블을 지원하지 않지만 부트 4는 다크 또는 반전 테이블을 지원합니다.

리드 4란 무엇입니까?

Bootstrap 4는 Bootstrap 프레임의 최신 버전입니다.그것은 다섯 가지 다른 격자 시스템이 있는데 그것이 바로 xs,sm,md,lg와xl이다.Bootstrap 4의 CSS 단원은rem이고,img 유체는 응답 이미지를 만드는 데 사용됩니다.이거.Bootstrap 4의 table dark 클래스에서는 사용자가 다크 테이블이나 반전 테이블을 만들 수 있습니다.
이제 Bootstrap 3과 Bootstrap 4 사이의 비교도를 살펴보겠습니다.우리는 일부 특징에 근거하여 이 두 용어를 비교하고 있다.

1. 그리드 시스템:

Bootstrap3에는 xs,sm,md,lg를 포함한 4층 격자 시스템이 있다.
Bootstrap4는 xs,sm,md,lg,xl를 포함한 5층 격자 시스템이 있다.

2. CSS 유닛:

Bootstrap 3의 CSS 셀은 px입니다.
Bootstrap 4의 CSS 셀은 rem입니다.

3. 글꼴 크기:

Bootstrap 3에서 글꼴 크기는 14px입니다.
그러나 Bootstrap 4에서는 글꼴 크기가 16픽셀입니다.

4. 응답 이미지:

이거.img responsive 클래스는 응답 이미지를 만드는 데 사용됩니다.
이거.img 유체 클래스는 응답 이미지를 만드는 데 사용됩니다.

5. 아이콘:

이것은 글꼴 아이콘을 지원합니다.
이것은 글꼴 아이콘을 지원하지 않습니다.

6. 다크서클/백서클:

그것은 암표/역표를 지원하지 않는다.
Bootstrap 4에서table dark 클래스는 암표/역표를 만드는 데 사용됩니다.

7. CSS 소스 파일:

더 적게 (더 간소화된 스타일시트).
SCSS(Sassy-CSS).

8. 호출기 교육 과정:

Bootstrap 3에서는 정렬을 사용하여 페이지를 정렬할 수 있습니다.지난 수업과 다음 수업.다음 시간.
부트 4 에서지난 수업과 다음 수업.다음 클래스는 지원되지 않습니다.

9. 구분자:

Bootstrap 3에서 섹션을 나누려면 이 필요합니다.구분자 클래스는 리 요소에 사용됩니다.
Bootstrap 4에서 섹션을 나누려면 가 필요합니다.하단 주파수 분할기는 div 요소에 사용할 수 있습니다.

10. 전체 너비 jumbotron:

Bootstrap 3에서jumbotron 유체 클래스는 전체 폭의 jumbotron을 만드는 데 사용할 수 없습니다.부트 4 는 사용자가 사용할 수 있도록 합니다.jumbotron 유체 클래스가 전체 폭의 jumbotron을 생성합니다.

11. 양식 컨트롤 크기:

Bootstrap 3에서는 양식 크기를 사용하여 늘리거나 줄일 수 있습니다.lg 및 를 입력합니다.sm 클래스를 입력합니다.
Bootstrap 4에서는 양식 크기를 사용하여 늘리거나 줄일 수 있습니다.창 컨트롤 lg와.폼 제어sm 클래스.

12. 도움말 텍스트:

Bootstrap 3에서 사용할 수 있습니다.도움말 차단 클래스가 도움말 텍스트를 표시합니다.
Bootstrap 4에서는 사용할 수 있습니다.도움말 텍스트를 표시하기 위한 창 텍스트 클래스입니다.

13. 메뉴 제목:

Bootstrap3에서 를 사용하여 메뉴 헤더를 만들 수 있습니다.드롭다운 제목 클래스

<li>

라벨
Bootstrap 4에서 를 사용하여 메뉴 헤더를 생성할 수 있습니다.드롭다운 제목 클래스

<h1>, <h2> 

라벨

14. 인라인 탐색:

아니요.탐색 내연 클래스는 Bootstrap 3에 포함됩니다.
일종의 용법이 있다.부트 프로그램 4의 nav inline 클래스에서 nav inline을 표시합니다.

15. 드롭다운 구조:

Bootstrap 3에서는 드롭다운 구조가 사용됩니다.

<ul> and <li>.

Bootstrap 4에서는 드롭다운 구조가 사용됩니다.

<ul> and <div>.

16. 패널 및 축소판 그림:

Bootstrap 3에서는 우물, 패널 및 축소판이 지원됩니다.
Bootstrap 4에서는 우물, 패널 및 축소판이 지원되지 않습니다.대신 카드를 사용할 수 있다.

17. 회전목마 프로젝트:

Bootstrap 3에서 클래스.프로젝트는 회전 목마 프로젝트를 만드는 데 사용됩니다.Bootstrap 4에서 클래스.룰렛 항목은 룰렛 항목에 사용됩니다.

18. 고정된 내비게이션 막대:

Bootstrap 3에서는 탐색 모음이 사용됩니다.탐색 모음은 위쪽과 위쪽을 고정합니다.탐색 모음의 하단을 고정합니다.
Bootstrap 4에서 탐색 모음을 사용합니다.위쪽과 위쪽을 고정합니다.하층 계급을 고정시키다.

19. 탐색 모음 색상:

Bootstrap 3에서는 색상 옵션이 제한됩니다.그것은 역방향 내비게이션 게이지를 지원한다.다른 클래스는 지원되지 않습니다.
Bootstrap 4에 새 색상 옵션이 있습니다.그것이 도입되었다.내비게이션 표시등.네비게이션 표시줄 암흑 수업.그것도 허락한다.내비게이션 표시줄에 사용할 bg-* 클래스입니다.

20. 초대형 버튼:

의 도움말 아래 초소형 버튼을 생성할 수 있습니다.btn xs 클래스.
Bootstrap 4에서는 초소형 버튼을 더 이상 사용할 수 없습니다.유일하게 사용할 수 있는 과정은btn sm 및.btn lg.

21. 프로파일 버튼:

부트 3에서는 아웃라인 버튼이 지원되지 않습니다.
Bootstrap 4가 도입되었습니다.btn outline-* 버튼 스타일을 아웃라인 색상으로 설정합니다.

22. 버튼 스타일:

그것은 포함된다.btn 기본값 및.btn 정보 클래스.
그것은 포함된다.btn2급.빛과 빛.암흑 수업.

23. 버튼 크기:

의 도움말 아래 초소형 버튼을 생성할 수 있습니다.btn xs 클래스.
Bootstrap 4에서는 더 이상 큰 크기의 버튼이 제공되지 않습니다.유일하게 사용할 수 있는 과정은btn sm 및.btn lg.

24. 오프셋 열:

Bootstrap 3에서col-offset-class를 사용하여 열을 오프셋합니다.예를 들어col-md-offset-4.
그러나 Bootstrap 4에서는 오프셋 - 클래스를 사용하여 열을 오프셋합니다.예를 들어offset-md-4.

25. 확인란 및 라디오 버튼:

Bootstrap 3에서 확인란 또는 라디오 상자는 클래스의 도움말(예:)에서 작성됩니다.라디오무선 회선.확인란, 및.확인란 내연.
Bootstrap 4에서는 클래스(예:)를 사용하는 도움말 아래 확인란과 라디오 버튼이 만들어집니다.표 검사.테이블 체크 레이블.양식 체크 입력 및.양식 검사 내연.

26. 미디어 객체:

Bootstrap 3에는 미디어 객체에 사용되는 다양한 클래스(예:)가 있습니다.매체매체 기구.미디어 대상.미디어 제목.미디어 리스트 등등.
Bootstrap 4에서 미디어 객체에 사용되는 클래스는 하나뿐입니다.매체

27. 표 제목:

그것은 시계 헤더를 지원하지 않는다.
Bootstrap 4에서 머리글 수정자 클래스(예:).스레드 기본값 및.스레드 반전이 추가되었습니다.
상술한 비교 사실은 최신 버전의 Bootstrap에 많은 강화 기능이 있음을 나타낸다.지금까지 우리는 두 버전의 안내 프로그램 간의 차이, 즉 안내 프로그램 3과 안내 프로그램 4를 이해했다.본고는Bootstrap3과Bootstrap4를 비교할 수 있는 유일한 곳이 아니다.Bootstrap의 공식 사이트에 가서 더 많은 정보를 얻는 것이 좋다.
글은 여기에서 끝냅니다.나는 네가 이 문장이 너의 사용자 체험과 개발 능력을 향상시키는 데 매우 계발과 도움이 된다고 생각하기를 바란다.😅