css的列表

1)列表
   1、列表项标志
      list-style-type
      取值:
         1、无序列表
   none , disc , circle , square
2、有序列表
   none , decimal , lower-roman , upper-roman
3、none
   2、列表项图像
      属性:list-style-image
      取值:url(图像的路径)


      list-style-type:none;
      list-style-image:url(Images/type.png);
   3、列表项位置
      属性:list-style-position
      取值:
            outside : 在文本区域之外
   inside : 在文本区域之内
   4、列表属性(综合)
      属性:
        list-style:type url() position;
常用值:list-style:none;
   5、用法
      1、CSS重写
         将一些标签的默认样式修改掉
*{
margin:0px;
padding:0px;
list-style:none;
}
      2、导航






      <ul>
<li>
<h3>图书、音像、数字商品</h3>
</li>
      </ul>
       
2、定位
   1、什么是定位
      ... ...
   2、定位方式
      1、浮动定位
         脱离文档流,不占用页面空间,会靠在包含框的左边或者右边,或者离他最近的浮动元素
      2、相对定位、绝对定位、固定定位、[静态定位]
   3、定位属性
      1、定位方式相关属性
         position
取值:
     1、static : 默认,静态定位
     2、relative : 相对定位
     3、absolute : 绝对定位
     4、fixed : 固定定位
      2、与定位位置相关属性
         top
bottom
left
right
以像素为单位的值
      3、堆叠顺序
         z-index : value;
值越大越靠近用户
   4、static
      页面中默认定位方式,即文档流定位
   5、相对定位
      相对于当前元素本身出现的位置而实现定位的一种方式
      实现方式:
        position:relative;
通过 top bottom left right 来实现位置移动
      使用场合:
        1、会进行位置的微妙的调整
2、配合着绝对定位使用
   6、绝对定位
      特点:脱离文档流,不占据页面空间
      定位位置:相对于【最近】的【已定位】的【祖先】元素
                如果祖先元素没有进行定位,它的位置就相对于最初的包含块(body)
      <nav>
        <div>
 <p>
  <span></span>
 </p>
</div>
      </nav>
      已定位:非static , 指 relative、absolute、fixed
      实现方式:
         position:absolutel
top,bottom,left,right : 位置偏移量,相对于最近的已定位的祖先元素去偏移。
      使用场合:
         1、弹出菜单的位置
   所有的弹出菜单都是绝对定位
   7、固定定位
      将元素固定在页面上的某一个位置,不随滚动条滚动而发生改变
      语法:
           position:fixed;
  top、left、right、bottom

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值