반응형 html31 bootstrap tooltip 부트스트랩 툴 소스 코드 안녕하세요. 부트스트랩은 웹 페이지를 구성하는 좋은 기능들이 있습니다. 툴팁은 웹 페이지의 방문자에게 추가적인 정보를 쉽게 전달할 수 있습니다. 또한 정보를 요약해서 UI를 개선할 수 있습니다. 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 codeomni.tistory.com bootstrap tooltip 부트스트랩 툴 소스 코드 body { padding: 100px 100px; } codeomni 위 툴팁 아래 툴팁 오른쪽 툴팁 $(function () { $('[data-toggle="tooltip"]').tooltip() }) Colored by Color S.. 2018. 8. 14. j Query 플러그인 풀 스크린 배경 Backstretch.js 플러그인 소스 코드 안녕하세요. 풀 스크린 배경인 웹 페이지는 특정 주제를 강조하거나 정보를 쉽게 전달할 수 있습니다. 웹 페이지로 풀 스크린 배경을 제작하는 방법은 여러 방법이 있습니다. j Query, bootstrap 등의 플러그인을 사용해서 쉽게 제작할 수 있습니다. j Query에는 풀 스크린 배경을 지원하는 Backstretch이 있습니다. 플러그인은 j Query에 포함되어 있기 때문에 쉽게 소스 코드로 구현할 수 있습니다. Backstretch 페이지(http://www.jquery-backstretch.com/)에 접속하시면 다운로드와 함께 사용방법을 얻을 수 있습니다. 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29.. 2018. 8. 14. bootstrap navigationbar navbar 부트스트랩 네비게이션바 네비바 소스 코드 안녕하세요. 부트스트랩은 여러가지 편의 기능을 제공합니다. 이번에 게시할 글은 부트스트랩의 네비바(navbar)입니다. 대부분 웹 페이지에 접속하시면 상단에 보이는 메뉴입니다. 사용자에게 웹 페이지의 기능을 편하게 제공합니다. 구현하기 위해서는 많은 코드가 필요하지만 부트스트랩에서는 작성자를 위한 간단한 코드를 제공합니다. 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 codeomni.tistory.com bootstrap navigationbar navbar 부트스트랩 네비게이션바 네비바 소스 코드 body { padding: 100px.. 2018. 8. 13. bootstrap navigation 부트스트랩 네비게이션 소스 코드 안녕하세요. 부트스트랩은 웹 페이지에 방문하는 사용자들을 위해 다양한 편의 기능을 제공합니다. 네비게이션은 웹 페이지 안에서 사용자들의 이동을 쉽게 합니다. html로 네비게이션을 구현하기 위해서는많은 소스 코드가 필요합니다. 부트스트랩은 작성자의 편의를 위해 .nav를 사용합니다. 또한 네비게이션의 다양한 UI도 제공하고 있습니다. 구현할 웹 페이지에 맞는 스타일을 사용하세요. 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 6.. 2018. 8. 13. html bootstrap popover 부트스트랩 팝오버 소스 코드 안녕하세요. 부트스트랩에는 웹 페이지를 쉽게 구현할 수 있는다양한 기능들이 있습니다. 기능들은 사용자에게 편의를 주고 시각적인효과를 줍니다. 팝 오버는 웹 페이지에 메모처럼 추가적인 내용을효과적으로 표현합니다. 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 codeomni.tistory.com bootstrap popover 부트스트랩 팝오버 소스 코드 body { padding: 100px 100px; } Popover button $("#pop").popover(); Colored by Color Scripter cs ▲ 실행 화면입니다. 참고 문헌 Popovers . (Aug 12 2018). http://boo.. 2018. 8. 12. vegas 플러그인 풀스크린 배경 소스 코드 안녕하세요. html 문서에는 다양한 플러그인이 있습니다. 플러그인을 통해서 작성자에게 알맞는 홈페이지를 구현할 수 있습니다. Vegas 플러그인을 사용하시면 손쉽게 풀 스크린 홈페이지를 구현할 수 있습니다. https://vegas.jaysalvat.com/ Vegas 플러그인 홈페이지입니다. 접속하시면 다운로드와 사용 방법을 파악할 수 있습니다. 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 codeomni.tistory.com vegas 플러그인 풀스크린 배경 소스 코드 $(function(){ $('body').vegas({ slides:[ {src:'veg.. 2018. 8. 11. html favicon icon 아이콘 소스 코드 안녕하세요. 접속한 웹 페이지의 탭 부분을 보면 해당 사이트에 로고나, 아이콘을 볼 수 있습니다. 파비콘(favicon)으로 웹 사이트를 대표하는 아이콘입니다. html 코드 중 태그를 이용하여 간단하게 구현할 수 있습니다. 1 2 3 4 5 6 7 8 9 10 codeomni.tistory.com html favicon icon 아이콘 소스 코드 html favicon icon 소스 코드입니다. Colored by Color Scripter cs ▲ 아이콘의 크기는 16*16 픽셀로 제작합니다. ▲ 실행 화면입니다. 2018. 8. 10. 이전 1 2 다음 반응형
