Live
x
<html> <head> <title>Elementy blokowe</title> </head> <style> /* Elementy domyślnie blokowe */ div, ul, li { border: 2px solid red; font-size: 1.5em; margin: 10px 0; } /* Elementy domyślnie liniowe */ input, button, span { border: 2px solid blue; font-size: 1.5em; margin: 10px 0; } /* <span /> jest domyślnie elementem liniowym, więc musimy mu ustawiać własność "display" */ span.one { display: block; } </style> <body> <section> <span class="one">span 1 (<code>display: block</code>)</span> <span>span 2</span> <input placeholder="input" /> <button>button</button> <div class="one">div 1</div> <div class>div 2</div> <ul> <li>Lista 1</li> <li>Lista 2</li> <li>Lista 3</li> </ul> </section> </body></html>
External CSS
This Pen doesn't use any external CSS resources.
External JavaScript
This Pen doesn't use any external JavaScript resources.