Magento Expert Forum - Improve your Magento experience

Results 1 to 7 of 7

How to use inline css?

  1. #1

  2. #2
    Junior Member
    Join Date
    Oct 2016
    Posts
    984
    Thanks
    1
    Thanked 4 Times in 4 Posts

    Default

    When CSS is written using the style attribute, it's called an "inline style". Inline styles look and operate much like CSS, with a few differences. Inline styles directly affect the tag they are written in, without the use of selectors.

    For example:

    <html>
    <head>
    </head>
    <body>
    <p style=”color:blue;”>
    I am paragraph.
    </p>
    </body>
    </html>

  3. #3
    Junior Member
    Join Date
    Mar 2017
    Location
    Delhi
    Posts
    244
    Thanks
    0
    Thanked 1 Time in 1 Post

    Default

    It's simple to use but it increases your Page Load Time that is not a good practice. Use Inline CSS where necessary otherwise avoid it.
    See the below code for how you can use it

    Inline CSS is used to apply the unique style to a single HTML element

    This style tag change the color of your heading
    <h2 style="color:blue;"> your text or heading>/h1>

  4. #4
    Junior Member
    Join Date
    Sep 2016
    Posts
    220
    Thanks
    0
    Thanked 3 Times in 3 Posts

    Default

    The inline style uses the HTML "style" attribute. This allows CSS properties on a "per tag" basis. The following is an example of how the inline style is used.

    <p style="color:red;font-size:18px">This is a paragraph!</p>

    This inline style will change the color of the paragraph to red and make the font size 18 pixels.


    Corporate Team Building Games | Corporate Team Building Activities
    Last edited by vishnu; 03-05-2019 at 07:56 AM.

  5. #5
    Junior Member
    Join Date
    Sep 2018
    Location
    United Kingdom
    Posts
    157
    Thanks
    0
    Thanked 2 Times in 2 Posts

    Default

    Utilize the HTML style quality for inline the code where you apply or design. Utilize the HTML <style> component to characterize inward CSS. Utilize the HTML <link> component to allude to an outer CSS document. Utilize the HTML <head> component to store <style> and <link> components. Utilize the CSS shading property for content hues.

  6. #6
    Junior Member
    Join Date
    Feb 2018
    Posts
    103
    Thanks
    0
    Thanked 2 Times in 2 Posts

    Default

    Inline style sheets is a term that refers to style sheet information being applied to the current element. By this, I mean that instead of defining the style once, then applying the style against all instances of an element (say the <p> tag), you only apply the style to the instance you want the style to apply to. Actually, it's not really a style sheet as such, so a more accurate term would be inline styles.


    Corporate Gifts | Corporate Gifts Suppliers in Delhi | Corporate Gifts Suppliers in Noida

  7. #7
    New member
    Join Date
    Jun 2019
    Posts
    9
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Thanks for the infomation.

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •