Bootstrap 3 Elements Features in Detail Part 1

February 10, 2014

Part 1 of features in detail series

In just a couple of days DMXzone Bootstrap 3 Elements will make its official appearance but until then we'll show you the features that are included in it. Starting today, we'll cover typography, tables, forms, buttons, images and icons. Check out the details below and stay tuned for part 2, coming tomorrow, when we will show you the rest of the awesome elements included in this fantastic Dreamweaver tool, which is set for release on Wednesday!

The Story

Typography

Title
The default title element is H3. You can change it with another heading between H1 and H6.   From the element properties you can change the alignment to be default, left, center, right and justify. Also you can choose from six default lightweight styles (emphasis).



Paragraph
Paragraphs are by default 14px font size with a line height of 1.428. In addition, paragraphs receive a bottom margin of half their line-height (1-px by default).



Address 
Add contact information such as address, name, phone number, etc.





Blockquote
You can quote any block of content from another source within your page. Blockquote can be aligned to the left or pulled to the right.



Unordered List
Add a list of items with bullets, where the order doesn't matter. From the element properties you can remove the default styling and also show all list items inline.




Ordered List
Add a list of items with numbering, where the order does matter. From the element properties you can remove the default styling and also show all list items inline.



Definition List
Add a list of terms, features or anything that needs a definition or explanation. From the element properties you can make the list also horizontal.



Tables

Table
Add a table with as many rows and columns as you wish. From the element properties you can choose the table row style and also style the table with borders and rounded corners. You can enable the rows hover state and make it more compact by cutting cell padding in half by checking the condensed mode. Now your table can be also responsive.



Forms

Form
Add a form where your users enter data for processing. From the element properties, the form can also be inline.



Search Form
Add a search field to your forms, where your users will type in keywords to search through the content.



Horizontal Form
In the horizontal form, the labels and input fields are on the same line.




Control Group
Add a simple input field with a label.


Buttons 

Button
You can add buttons with different sizes (large, default, small and extra small) and choose one of the predefined lightweight designs. From the element properties you can make a button non-clickable by disabling it or make it fit the cell entirely by width.



Anchor Button
If you need to use a text link that looks like a button, anchor button element is the right one to choose.


Button with icon
There are 200 icons supplied in the extension that you can use on any button size or design.



Button group
You can add as many buttons next to each other as you need. They can be with or without styling and icons. The alignment can be horizontal as well as vertical.

Images

Image
There are 4 styles you can add to the images - default, rounded corners, circle and thumbnail. Also you can set the images to be fully responsive.



Icons 

Icon
200 icons in sprite form to be used in buttons, button groups for a toolbar, or prepended form inputs.

Related Blog Posts

Lubov Cholakova

Lubov CholakovaLubov has been with DMXzone for 8 years now, contributing to the Content and Sales departments. She is bringing high quality content in the form of daily blog updates, reviews, tutorials, news, newsletters,update emails and extensions' manuals. If you have a product that needs publicity or any other questions about the entire DMXzone community, she is the one you can contact.

See All Postings From Lubov Cholakova >>

Comments

Be the first to write a comment

You must me logged in to write a comment.