有序列表和无序列表、流、格式布局:position

2023-07-29,,

列表方块:

有序列表和无序列表 ol/ul 例如<ol: style:"list-style:""  ">

  1、<ol: style:"list-style:"none" ">:none 时间<li>里面内容前边的序号去掉(•ABC)

  2、<ol: style:"list-style:"inside" ">:inside(•ABC)将ABC前边的序号黑点连在一起为一个元素内容

  3、<ol: style:"list-style-image:"" ">:可以将序号(•ABC)变为小图片

格式与布局

一、位置

  1、position:①fixd(固定):该元素外层没有固定位置的元素时,相对于浏览器边框位置固定

        top.right.bottom.left.用来<div>里面元素的位置

         ②absolute(绝对):是相对于它上一层来说的,它上一层也必须有绝对定位(absolute)/相对于父级元素(浏

         览器,绝对定位的上级)

fixd和absolute唯一区别是absolute随网页滚动而滚动,fixd不随网页滚动而滚动

         ③relative(相对):之前位置——top 50px left 50px——在之前的位置上分别靠下和靠右移动50px/相对自

         身之前的位置

  2、<style type:"text/css">

       *{margin:opx  auto; padding:0px}:auto是指这个<div>居中;元素边框相重叠的小部分去掉

二、流:(folat,可以吧div的默认占一行去掉)

  1、left:向左流;right:向右流

  2、用folat的div在结束之后,要用<div style="clear:both"></div>清流

  3、folat一般要配合margin使用

小知识:

★  做导航栏一般用folat或<ul>来做

★  z-index:使网页的两个元素分层,这两个元素属性里必须要有position或folat;

z-index值越大越靠前

★  *代表全部 它的优先级最低

★  .test:horer{cursor:position} 鼠标变成小手 括号里包括鼠标的各种样式

★   break:用来跳出整个循环  continue:跳出本次循环

有序列表和无序列表、流、格式布局:position的相关教程结束。

《有序列表和无序列表、流、格式布局:position.doc》

下载本文的Word格式文档,以方便收藏与打印。