CSS列表元素

  1. ul无序列表、ol有序列表
    list-style-image:设置图片作为列表中的项目符号
    可用值:none,url
    list-style-position:设置项目符号的放置位置
    可用值:inside,outside
    list-style-type:设置项目符号的几种默认样式
    可用值:none,disc,circle,square,decimal,(ul
    这里写图片描述
    lower-roman,upper-roman,lower-alpha,upper-alpha (ol
    这里写图片描述

  2. 使列表变为段落
    使用display:inline不建议使用float:left
    html:

<html>
 <head>
  <title>div</title>
  <link rel = "stylesheet" type="text/css" href = "layout.css">
 </head>
 <body>
  <h2>在这一章中,我们主要探讨如下几个方面</h2>
  <ul>
   <li>布局概述</li>
   <li>页面元素入门</li>
   <li>高级技巧</li>
   <li>疑难解答</li>
  </ul>
  <h2>以及其他更富创造性的页面设计</h2>
 </body>
</html>

layout.css

ul {
 display:inline;
 margin-left:5px;
 padding:0;
}
ul li {
 display:inline;
}
h2 {
 display:inline;
 font-size:16px;
 font-weight:normal;
}

猜你喜欢

转载自blog.csdn.net/qq_22038259/article/details/82682825