Block elements and inline elements can be converted using display
Display:inline-> to inline elements (for example, Div)
Display:block-> to block elements (e.g. a)
Cases:
<title> block elements and inline elements of mutual conversion </title>
<link rel= "stylesheet" style= "Text/css" href= "Test.css"/>
<body>
<p class= "CLS1" >www.bianceng.cn</span></p>
<p class= "CLS2" >www.bianceng.cn</span></p>
</body>
Content of Test.css:
. cls1{
Color:blue;
Background-color:yellow;
font-size:20px;
Font-weight:bold;
Display:block; /* per block element display, full line * *
}
. cls2{
Color:blue;
Background-color:yellow;
font-size:20px;
Font-weight:bold;
Display:inline; /* By inline element display, only the width of the text, not fill the entire line * *
}Effect as shown:
More Wonderful content: http://www.bianceng.cnhttp://www.bianceng.cn/web/Css/
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
