trinhtanloc789
trinhtanloc789
/ bootstrap-tabs-pills.markdown
Created
November 1, 2019 08:53
[bootstrap] tabs/pills
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <div class="tabs"> | |
| <ul> | |
| <li><a href="#section1">Section 1</a></li> | |
| <li><a href="#section2">Section 2</a></li> | |
| <li><a href="#section3">Section 3</a></li> | |
| <li><a href="#section4">Section 4</a></li> | |
| <li><a href="#section5">Section 5</a></li> | |
| </ul> | |
| <section id="section1"> | |
| <h2>Section 1</h2> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| .card | |
| .card-play | |
| .card-video | |
| iframe#video(src="https://www.youtube.com/embed/JE9z-gy4De4?enablejsapi=1&html5=1&iv_load_policy=3&rel=0&showinfo=0", frameborder="0", allowfullscreen) |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <div class="main"> | |
| <div class="slideContainer"> | |
| <label>Value: <span id="value"></span></label> | |
| <input type="range" min="0" max="100" value="1" class="slider" id="myRange"> | |
| </div> | |
| </div> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <html lang="en-US"> | |
| <title>Simple Range Input Slider With Output</title> | |
| <head> | |
| <link href='https://fonts.googleapis.com/css?family=Quantico' rel='stylesheet' type='text/css'> | |
| </head> | |
| <div class="container"> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <main> | |
| <form oninput="output.value = Math.round(range.valueAsNumber / 1000)"> | |
| <h2> | |
| Range slider | |
| </h2> | |
| <div class="range"> | |
| <input name="range" type="range" min="0" max="100000"> | |
| <div class="range-output"> | |
| <output class="output" name="output" for="range"> | |
| 50 |
Styling an input range slider with pure CSS. JS only to grab the value.
A Pen by Sean Stopnik on CodePen.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <div class="container"> | |
| <input type="range"/> | |
| <output data-output></output> | |
| </div> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <div class="container"> | |
| <div class="row"> | |
| Date formats: yyyy-mm-dd, yyyymmdd, dd-mm-yyyy, dd/mm/yyyy, ddmmyyyyy | |
| </div> | |
| <br /> | |
| <div class="row"> | |
| <div class='col-sm-3'> | |
| <div class="form-group"> | |
| <div class='input-group date' id='datetimepicker1'> | |
| <input type='text' class="form-control" /> |
NewerOlder