css 排版 test

<!DOCTYPE html><html><head> <meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"> <style> ._ul>li, ._dl>dd { display: inline-block; /*行内块元素*/ } </style></head><body> <ul> <li style="color:red;">纵向排版</li> <li>li元素_001</li> <li>li元素_002</li> <li>li元素_003</li> </ul> <dl> <dd style="color: red;">纵向排版</dd> <dd>dd元素_001</dd> <dd>dd元素_001</dd> <dd>dd元素_001</dd> </dl> <ul class="_ul"> <li style="color: blue;">横向_自动_排版</li> <li>li元素_001</li> <li>li元素_002</li> <li>li元素_003</li> <li>li元素_004</li> <li>li元素_005</li> <li>li元素_006</li> </ul> <dl class="_dl"> <dd style="color: blue;">横向_自动_排版</dd> <dd>dd元素_001</dd> <dd>dd元素_002</dd> <dd>dd元素_003</dd> <dd>dd元素_004</dd> <dd>dd元素_005</dd> <dd>dd元素_006</dd> </dl></body></html>

 

相关文章