사용할 수 있는 도구는 Bootstrap Magic, BootSwatchr, Bootstrap Live Editor, Fancy Boot, Style Bootstrap, Lavish, LayoutIt, Pingendo, Bootply 등입니다.
이 튜토리얼의 운영 환경: Windows 7 시스템, bootsrap 버전 3.3.7, DELL G3 컴퓨터
Mark Otto와 Jacob Thornton이 2011년 Bootstrap을 개발한 이후 우리는 Bootstrap을 처음 접하고 익숙해졌습니다. . 모두 트위터 덕분입니다! 그 이후로 매우 인기를 얻었으며 최고의 반응형 프레임워크 중 하나가 되었습니다. Bootstrap은 개발자가 다수의 새로운 웹 프로젝트를 빠르고 효율적으로 시작할 수 있도록 도와주며 대다수의 개발자가 선호합니다.
부트스트랩에 대해 잘 알지 못하지만 좀 더 자세히 알고 싶은 개발자들을 위해 간략하게 소개하겠습니다. Bootstrap은 개발자가 새 프로젝트를 빠르게 시작하는 데 도움이 될 수 있는 다양한 액세서리와 사용하기 쉬운 플러그인이 포함된 사전 스타일 구성 요소의 확장 라이브러리입니다.
자, 오늘의 주제로 돌아가서 UI 편집기 또는 온라인 편집 도구라고도 할 수 있는 최고의 부트스트랩 디자인 도구 및 리소스 15가지를 소개합니다. 이 멋진 Bootstrap UI 편집기를 사용하면 개발자는 디자인 프레임워크를 사용자 정의하여 웹에 대한 모든 비전을 실현할 수 있습니다.
다음 목록은 Bootstrap을 사랑하는 모든 개발자 및 친구들과 공유할 수 있도록 엄선된 훌륭한 Bootstrap UI 편집기 목록입니다. 더 이상 적합한 Bootstrap 디자인 도구를 찾는 것에 대해 걱정할 필요가 없습니다. 수많은 Bootstrap 디자인이 도구들 사이에서 혼란스러워요! 아래 목록을 읽고 자신에게 맞는 Bootstrap UI 편집기를 찾으세요 :)
최신 Bootstrap 3 버전과 Angular JS 버전을 사용하여 생생한 미리보기를 제공하는 Bootstrap 테마 생성기입니다. 사용자 수정. 여기에는 다양한 가져오기, 색상 선택기 및 스마트 자동 완성 기능이 포함되어 있습니다. 더욱 놀라운 점은 Bootstrap이 각 사용자의 선택에 따라 이력서를 재구성하여 사용자가 더 쉽게 다운로드하고 사용할 수 있도록 한다는 것입니다.
BootSwatchr는 Drew Strickiand가 독립적으로 개발하고 유지관리하는 유일한 Bootstrap 사용자 정의 빌드 도구로, 이 기능도 오른쪽에서 왼쪽으로 표시됩니다. BootSwatchr은 처음부터 Bootstrap 테마를 만들기 위한 시각적 도구입니다.
Bootstrap Live Editor는 Bootstrap 구축을 위한 WYSIWYG 편집기입니다. Bootstrap이 준비한 콘텐츠와 코드 조각을 기반으로 HTML을 편집하고 아름답게 하는 멋지고 우아한 방법을 제공하기 때문에 현명한 선택입니다. 또한 버튼 구성, 사용자 정의 라벨, 사용자에게 가장 많은 정보를 제공하고 유익한 선택과 같은 고급 옵션이 포함되어 있습니다.
Fancyboot는 사용자가 Bootstrap 구성을 편집하고 수정 결과를 자동으로 미리 볼 수 있는 매우 유용한 Bootstrap 사용자 정의 도구입니다. 슬라이딩 메뉴를 통해 사용하려는 플러그인과 구성 요소를 선택할 수 있습니다. 사용자가 해당 변경을 수행하면 사용자가 사용하는 jQuery 플러그인이 포함된 컴파일되고 단순화된 CSS 파일을 다운로드할 수 있습니다.
스타일 부트스트랩은 사용자가 트위터 부트스트랩의 모양을 사용자 정의하는 데 도움이 되는 훌륭한 내장 브라우저 GUI 유틸리티입니다. 사용자 정의하는 것은 매우 쉽습니다. 바디 스타일, 타이포그래피, 버튼, 탐색, 서식, 알림 프롬프트 및 기타 요소를 사용자가 원하는 대로 쉽게 사용자 정의할 수 있습니다. 강력한 사용자 정의 기능 외에도 다운로드 가능한 CSS 파일을 쉽게 생성할 수 있습니다.
Lavish는 사용자가 이미지에서 좋아하는 Bootstrap 색 구성표를 맞춤 설정할 수 있는 도구입니다. 사용자는 이미지에서 다양한 색상을 선택하여 본문 배경, 링크, 헤더, 메뉴, 라벨, 텍스트, 드롭다운 메뉴 및 기타 요소에 사용할 수 있습니다. Bootstrap 색 구성표를 결정하면 해당 Boostrap.css 파일을 쉽게 다운로드할 수 있습니다.
Bootstrap ThemeRoller는 사용자가 자신의 스타일에 따라 자신만의 Bootstrap 테마를 만들 수 있는 시각적 인터페이스를 제공하는 직관적인 웹 애플리케이션입니다. 이 도구를 사용하면 사용자는 색상, 크기, 글꼴, 형식, 표, 버튼, 경고 메시지, 탐색 모음, 메뉴 및 기타 요소를 사용자 정의할 수 있습니다.
이 애플리케이션은 사용자가 만든 각 스타일에 대해 고유한 URL도 생성하므로 모든 사용자 설정이 저장될 수 있습니다. 더욱 놀라운 점은 사용자가 떠날 때 사용자가 사용자 정의된 페이지를 중지하거나 다시 시작할 수 있다는 것입니다.
LayoutIt! 드래그 앤 드롭 인터페이스 기능을 사용하면 Bootstrap 프런트엔드 코드를 쉽고 빠르게 구축할 수 있습니다. 레이아웃잇! 모든 프로그래밍 언어와 호환되므로 사용자는 HTML을 다운로드하고 여기에서 자유롭게 코딩 설계를 수행할 수 있습니다.
Pingendo는 사용자가 인기 있는 Twitter Bootstrap 프레임워크를 사용하여 반응형 웹 페이지 프로토타입을 만들 수 있는 시각적 데스크톱 애플리케이션입니다. Pingendo는 또한 다양한 기성 레이아웃, 드래그 앤 드롭 요소 위치 지정, 크기 조정 및 사용자 정의 기능을 제공합니다. 사용자는 자신의 페이지를 직접 최적화하고 자신의 콘텐츠를 삽입할 수 있습니다.
Kickstrap은 Firebase를 백엔드 서비스로 사용하는 Bootstrap UI 편집기입니다. Bootstrap과 최고의 웹 기술을 완벽하게 통합합니다. 더 좋은 점은 로컬 백엔드 지원이 필요하지 않은 검증된 데이터베이스 기반 웹 애플리케이션을 실행할 수 있다는 것입니다.
Bootply는 사용자가 Bootstrap 친화적인 CSS, HTML 및 Javascript를 최대한 쉽게 편집할 수 있게 해주는 훌륭한 Bootstrap UI 편집 도구입니다. 또한 Bootstrap 프레임워크를 설계, 프로토타입화 및 테스트하기 위한 드래그 앤 드롭 시각적 편집기이기도 합니다. Bootply에는 Bootstrap 코드 조각, 예제 및 템플릿이 포함된 코드 저장소가 있습니다. 위의 내용 외에도 더욱 매력적인 점은 사용자가 관련 코드와 스니펫을 쉽게 검색, 공유 및 표시할 수 있는 매우 활동적인 Bootply 커뮤니티가 있다는 것입니다.
기본 Bootstrap, jQuery UI 또는 순수 jQuery 편집 기능을 제공합니다. 이 Bootstrap UI 편집기에는 클라이언트 측 및 서버 측 유효성 검사, 키보드 지원, 라이브 이벤트, 사용자 정의 가능한 컨테이너 공간 등을 포함한 많은 강력한 기능이 있습니다. 전체적으로 매우 빠른 개발 기능, 손쉬운 필드 삭제, 데이터 업데이트를 위한 간단한 백그라운드 스크립트를 제공합니다.
Jetstrap은 100% 웹 인터페이스 기반의 Twitter Bootstrap 구축 도구일 뿐이라고 생각하지 마세요. 사용자는 Jetstrap을 사용하기 위해 어떤 유형의 소프트웨어도 다운로드할 필요가 없습니다. 사용자는 로그인하고, 자신의 프로젝트를 구축하고, 언제 어디서나 액세스하기만 하면 됩니다. 구축 기능은 주로 개발자와 디자이너에게 제공되며, Jetstrap을 통해 사용자는 쉽게 아름다운 웹사이트를 생성할 수 있으며, 실행 속도도 매우 빠릅니다
pShot은 빠르고 시각적인 프런트 엔드를 개발하는 것입니다. 텍스트 편집기는 모형 도구만큼 간단하고 깔끔합니다. 다양한 프레임워크에 필요한 다양한 맞춤형 구성 요소 라이브러리를 포함하여 제공하는 최고의 도구 중 하나입니다. 또한 사용자가 테마를 수정할 수 있도록 테마 변환기가 포함되어 있습니다. 평가판은 무료입니다. 평가판 기간 이후에는 원래 서비스를 유지하려면 비용을 지불해야 합니다.
PaintStrap은 Adobe kuler/COLOURlovers 색상 조합을 사용하여 아름다운 Twitter Bootstrap 테마를 생성합니다. 이 도구는 설치가 매우 쉽고 CSS 파일을 쉽게 다운로드하여 다른 표준 파일로 교체할 수 있습니다.
추천 학습: "부트스트랩 사용 튜토리얼"
위 내용은 개발에 일반적으로 사용되는 부트스트랩 UI 도구는 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!
![[웹 프런트엔드] Node.js 빠른 시작](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
