HTML <p> style Attribute

A style attribute on a <p> element.

<p style="width: 350px;padding: 20px;background: papayawhip;">
    The Palace Museum is a national museum housed in 
    the Forbidden City at the core of Beijing, China. 
    It was established in 1925 after the last Emperor 
    of China was evicted from his palace, and opened 
    its doors to the public.
</p>

<p style="CSS-styles">

A style attribute on a <p> element.
Clicking the button toggles the height of the paragraph.

<p id="myparagraph"
   style="width:300px; height:200px; padding:20px;
          background:papayawhip; overflow:auto;">
    The Palace Museum is a national museum housed in 
    the Forbidden City at the core of Beijing, China. 
    It was established in 1925 after the last Emperor 
    of China was evicted from his palace, and opened 
    its doors to the public.
</p>

<br />
<button onclick="toggle();">Toggle style</button>

<script>
  let toggle = () => {
    let element = document.getElementById("myparagraph");

    if (element.style.height === "200px") {
       element.style.height = "auto";
    } else {
       element.style.height = "200px";
    }
  }
</script>

Code explanation

Here is when style support started for each browser:

Chrome	1.0	Sep 2008
Firefox	1.0	Sep 2002
IE/Edge	1.0	Aug 1995
Opera	1.0	Jan 2006
Safari	1.0	Jan 2003

• Our HTML p Tag Reference
• Our HTML style Attribute Reference
• Our CSS Text Tutorial