《Web前端开发基础》课件-6-5元素定位_第1页
《Web前端开发基础》课件-6-5元素定位_第2页
《Web前端开发基础》课件-6-5元素定位_第3页
《Web前端开发基础》课件-6-5元素定位_第4页
《Web前端开发基础》课件-6-5元素定位_第5页
已阅读5页，还剩7页未读， 继续免费阅读

下载本文档

版权说明：本文档由用户提供并上传，收益归属内容提供方，若内容存在侵权，请进行举报或认领

文档简介

《web前端》课程任课教师：元素定位任务：二级导航的制作任务展示二级导航的实现2第一部分Knowledge元素的定位属性1.定位方式-position在HTML中，可以使用CSS来对元素进行定位，定位方式属性用于设定浏览器应如何来定位HTML元素。定位属性定位一语法：position：static|absolute|fixed|relative2.元素位置top、right、bottom、left元素位置属性与定位方式共同设置元素的具体位置.语法：top：auto|px|%共同定义1.定位方式-position：static定位属性定位一static为默认值。表示没有定位，元素出现在正常的文档流中(忽略top属性、bottom属性、left属性、right属性或者z-index属性)。元素会按照HTML文档中的顺序显示。2.定位方式-position：relative定位属性定位一relative表示采用相对定位，对象不可层叠，但将依据left、top、right、bottom等属性设置在页面中的偏移位置。(即在文档中仍占据原来的位置）仍占据原来的位置3.定位方式-position：absolute定位属性定位一绝对定位是将元素依据最近的已经定位(绝对、固定或相对定位)的父元素进行定位，若所有父元素都没有定位，则依据body根元素(浏览器窗口)进行定位。当position属性的取值为abso1ute时，可以将元素的定位模式设置为绝对定位。4.定位方式-position：fixed定位属性定位一fixed总是根据浏览器的窗口来进行元素的定位，且不会随着滚动条的滚动而改变。拖动滚动条，盒子位置不变层叠顺序属性用于设定层的先后顺序和覆盖关系，该属性实际是设置元素沿z轴的位置。默认情况下，z-index值为1，拥有更高堆叠顺序的元素总是会处于堆叠顺序较低的元素的前面。【取值auto表示遵从其父对象的定位；取数字值是必须是无单位的整数值，可以取负值。】注意：本属性只对设置了定位属性的盒子才起作用。语法：z-index:auto|数字说明：z-index值高的层覆盖z-index值低的层。一般情况下，z-index值为1，表示该层位于最下层。层叠顺序设置二1.层叠顺序z-index。层叠顺序设置二1.层

人人文库> 全部分类> 教育资料 > 课件下载

温馨提示

  • 1. 本站所有资源如无特殊说明，都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
  • 2. 本站的文档不包含任何第三方提供的附件图纸等，如果需要附件，请联系上传者。文件的所有权益归上传用户所有。
  • 3. 本站RAR压缩包中若带图纸，网页内容里面会有图纸预览，若没有图纸预览就没有图纸。
  • 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
  • 5. 人人文库网仅提供信息存储空间，仅对用户上传内容的表现方式做保护处理，对用户上传分享的文档内容本身不做任何修改或编辑，并不能对任何下载内容负责。
  • 6. 下载文件中如有侵权或不适当内容，请与我们联系，我们立即纠正。
  • 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。

最新文档

评论

0/150

提交评论