inotgo.com


Tool version compatibility problem
BootStrap yes Twitter The front-end framework developed by our engineers , Can be very convenient to design a good-looking page effect .

This chapter demonstrates some basic elements use Bootstrap The difference between and without
Correct


Step 1 :

use Bootstrap The difference between and without

edit top fracture
Correct ask
Demo button Input box Drop down boxes and other common components , In primary html and Bootstrap The effect is more
Several html There is no effect in
<!DOCTYPE html> <script src="/study/js/jquery/2.0.0/jquery.min.js"></script> <link href="/study/css/bootstrap/3.3.6/bootstrap.min.css" rel="stylesheet"> <script src="/study/js/bootstrap/3.3.6/bootstrap.min.js"></script> <table width="200" border="1" class="table table-bordered"> <tr> <td>HTML</td> <td>Bootstrap</td> </tr> <tr> <td><button> Button </button></td> <td><button class="btn btn-success"> Button </button></td> </tr> <tr> <td><input type="text" value=" Input box "></td> <td><input type="text" value=" Input box " class="form-control"></td> </tr> <tr> <td> <select > <option> Multiple selection boxes </option> <option> Multiple selection boxes </option> <option> Multiple selection boxes </option> <option> Multiple selection boxes </option> </select> </td> <td> <select class="form-control"> <option> Multiple selection boxes </option> <option> Multiple selection boxes </option> <option> Multiple selection boxes </option> <option> Multiple selection boxes </option> </select> </td> </tr> </tr> <tr> <td > drop-down menu ( tradition HTML Do not provide )</td> <td> <div class="dropdown"> <button type="button" class="btn dropdown-toggle" id="dropdownMenu1" data-toggle="dropdown"> http://192.168.1.189 <span class="caret"></span> </button> <ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu1"> <li> <a href="#">Java Basics </a> </li> <li role="presentation"> <a href="#">Java Intermediate </a> </li> <li role="presentation"> <a href="#"> Front end Foundation </a> </li> <li role="presentation" class="divider"></li> <li role="presentation"> <a href="#"> Server side </a> </li> <li role="presentation"> <a href="#"> Frame </a> </li> </ul> </div> </td> </tr> <tr> <td > Panel ( tradition HTML Do not provide )</td> <td> <div class="panel panel-success"> <div class="panel-heading"> Panel title </div> <div class="panel-body"> Panel content <br> Panel content <br> Panel content </div> </div> </td> </tr> </table>


Source code
1. Double click the selected word 2. Triple Click to select the entire row 3. CTRL+F Find 4. F8 Full screen editing , Click restore again
Rendering Rendering complete
effect


The official account of programming , Follow and get the latest tutorials and promotions in real time , thank you .


Q & A area    
2019-12-05 Startup class bootStrap and Bootstrap The difference between frames
Doudou beat Doudou

about Front end part -BootStrap- Introduction Your questions
stationmaster , In the muddle headed account project , There is a startup class bootStrap. And this is about CSS of Bootstrap Frame . Is there no connection between the two , Or what's the difference ？




1 One answer

Handsome and inhuman
Answer time ：2019-12-28
This must have nothing to do with ==



The answer has been submitted successfully , Auditing . Please My answer Check the answer record at , thank you
answer Or code please Fill in at least one , If you have a problem , Please ask again , Otherwise, the webmaster may not see



2018-08-28 [ Practice projects ] Front end part -BootStrap, Is there any program suitable for hand training ？
Cloud in the yard

about Front end part -BootStrap- Introduction Your questions
Stationmaster boss , Hello! . I've been doing BootStrap Some of your needs , Are there any practical projects suitable for hand training ？




1 One answer

BeachFish
Answer time ：2019-07-03
stationmaster , Well, I miss you ~ since 2017 I haven't seen you since



The answer has been submitted successfully , Auditing . Please My answer Check the answer record at , thank you
answer Or code please Fill in at least one , If you have a problem , Please ask again , Otherwise, the webmaster may not see



2018-04-23 Careful, I found that this website is adopted bootstrap The frame is made of




Please... Before asking questions land
The question has been submitted successfully , Auditing . Please My question Check the question record at , thank you
about Front end part -BootStrap- Introduction Your questions

Try to provide Screenshot 、 code and Abnormal information , Help to analyze and solve problems . You can also enter this station QQ Group communication : 496725845
Ask questions and try to provide complete code , Environment description , The more conducive to the recurrence of the problem , The faster your question can be answered .
Have questions about the code in the tutorial , Please provide which step , Which line is in doubt , This makes it easy to quickly locate the problem , Improve the speed at which questions are answered
In the thousands of questions that already exist , A considerable proportion , Because of the use of and webmaster Different versions of the development environment Resulting in , For example jdk, eclpise, idea, mysql,tomcat Wait, the version of the software is inconsistent .
Please use the same version as the webmaster , You can save yourself a lot of learning time . The webmaster sorted out the software versions used in teaching , It's all here , Convenient for everyone to download ： /k/helloworld/helloworld-version/1718.html

Upload screenshot