HTML tutorial
CSS3 tutorial
Bootstrap tutorial
JavaScript tutorial
JQuery tutorial
AngularJS tutorial
React tutorial
NodeJS tutorial
PHP tutorial
Python tutorial
Python3 tutorial
Django tutorial
Linux tutorial
Docker tutorial
Ruby tutorial
Java tutorial
C tutorial
C ++ tutorial
Perl tutorial
JSP tutorial
Lua tutorial
Scala tutorial
Go tutorial
ASP.NET tutorial
C # tutorial
Toolbar elements usually located in the head and tail - make navigation easy access to:
Head column typically contains the page title / logo or one or two buttons (usually the home page, or search option).
You can add buttons to the left or right side of the head.
The following code will add a button to the left of the head of the title text, add a button to the right of the head of the title text:
The following code will add a button to the left of the head of the title text:
However, if you put the button link is placed after the <h1> element will not be able to display text to the right. To add a button to the right of the head of the title, specify the class as "ui-btn-right":
Header may contain one or two buttons, the tail without limitation. |
More flexible than the rear column header bar - throughout their pages more functional and variability, it can contain as many buttons:
Note: The tail and head different style (no padding and space, and the button is not centered). We can use a simple pattern to solve this problem:
You can also use the button in the rear horizontal or vertical combinations:
Head and tail can be positioned in three ways:
Using data-position property to locate the head and tail bar bar:
To enable full-screen positioning, use the data-position = "fixed", and add data-fullscreen attribute to the element:
Tip: Full targeting applies to photos, images and video.
Tip: fixed positioning and targeting full-screen by clicking on the screen will display and hide column head and tail bar.
On the toolbar displays icons only
On the toolbar displays icons only you can use the ui-btn-icon-notext class.