i
Designing Chaturbate Bios - <i>
HTML Tag - Italic
The HTML <i> element defines italic text, without any extra importance.
On Chaturbate this additional element is helpful when editing a custom design.
| TAG | HTML MARKUP | DEFINES |
|---|---|---|
<i> |
<i>...</i> |
HTML tag used to render the text italic |
HTML MARKUP
i - can be used as default, as it is, or empowered by inline-css.
HTML Markup Code:
<i>This is a text which uses simple italic HTML tags</i>
Will render:
This is a text which uses simple italic HTML tags
<i style="display:block;width:90%;height:auto;padding:15px;margin:4px auto 12px auto;font-size:16px;color:#666;background-color:#f1f1f1;">This is a text which uses italic HTML tags and inline-css</i>
Will render:
This is a text which uses italic HTML tags and inline-css
Code Snippets
Test markup codes and see how your browser is rendering them. Use button to see how to use the source editor and rendering tool
Markup Code Box
Default button, on click, removes the markup code from light-blue box
Render Box
That's how it looks rendered in browser. Optionally you can Save as PDF
Markup Codes using <i> HTML tag
Italic tags can hold different types of content but keep in mind that there's a certain legacy between all HTML tags.
Italic tags and how to style them to look more appealing using inline-CSS
1. Basic html for italic element with some inline-css
<i style="display:block;width:50%;height:auto;margin:7px auto 5px 3px;color:#036;padding:4px 8px;text-align:left;">Some Text Here</i>
Show:
Some Text Here2. Other styling using inline-css
<i style="display:block;width:50%;height:auto;margin:7px auto 5px 3px;color:#f1f1f1;padding:15px;text-align:left;background-color:#4b9cf3;">Some Text Here</i>
Show:
Some Text Here3. Other styling using inline-css
<i style="display:block;width:50%;height:auto;margin:7px auto 5px 3px;color:#f1f1f1;padding:15px;text-align:left;background-color:#222;-webkit-border-radius:20px 0 20px 0;border-radius:20px 0 20px 0;">Some Text Here</i>
Show:
Some Text Here4. Using italic HTML markup with a link inside
<i style="display:block;width:50%;height:auto;margin:7px auto 5px 3px;color:#f1f1f1;padding:15px;text-align:left;background-color:#222;-webkit-border-radius:20px 0 20px 0;border-radius:20px 0 20px 0;"><a href="#" style="color:pink;text-decoration:none;">Some Text Here as a link</a></i>
Show:
Some Text Here as a linkAs mentioned above, there's a legacy and a certain structure between markup codes, from parent to child. In this case the parent element is the italic and the child element is the link.
5. A bit more complex, 1 italic containing 2 other blocks defined as span (also a HTML tag accepted by Chaturbate)
<i style="display:block;width:80%;height:auto;margin:7px auto 5px 3px;padding:15px;text-align:left;background-color:#222;"><span style="display:inline-block;width:30%;height:auto;padding:10px;text-align:center;background-color:#F3C;color:#fff;margin:5px auto;">Box Left</span><span style="display:inline-block;width:30%;height:auto;padding:10px;text-align:center;background-color:#06C;color:#fff;margin:5px auto;">Box Right</span></i>
Show:
Box LeftBox Right
