1、绝对定位position: fixed(比如广告页面向下滑动的时候,页面最上方有个标题不能随之滑动,就需要用到position: fixed,同时还需要用到一个标签(标签高度很高才会出现滚动的情况))

随着滚动,最上面的块级不动,下面的文字可以随着滚动条而滚动

2、相对定位position:relative和被定位position:absolute,这两句如果不加的话,下面的对48*48的小方块无法挪到对应的角落

相对定位中z-index:n  属性(没有写z-index的就是z-index:0),只要n大于另一个z-index属性就会展示在页面最上层

3、滚动条属性(比如没有加滚动条属性时,给的图片会比较大时的情况)

解决办法:

1、裁剪多余的图片overflow:hidden;

2、新增滚动条overflow:scroll和overflow: auto;二者都可以实现滚动条,但是是有区别的

区别:无论外边框大于还是小于图片的时候,scroll都会加上滚动条,当边框大于图片时,auto会自动识别

用scroll

用auto

4、背景图属性background-image:url("......."):图片比外边框小时,会被重复显示整个边框

解决办法:background-repeat:no-repeat(表示不会被重复)

background-repeat:repeat-x(表示横向被重复填满)

背景图2:加大background-position会发现图片在方框内在移动

5、字体大小font-size:

正常情况是:

加大、加粗

6、鼠标放按钮上箭头图标变成小手的图标

7、点击某个超链接跳转到某个页面

css常用属性之绝对定位、相对定位、滚动条属性、背景图属性、字体、鼠标、超链接跳转页面的更多相关文章

  1. 利用css3的多背景图属性实现幻灯片切换效果

    css3里关于背景的属性增加了可以添加多背景图的特性,例如: .box{background: url(img/1.png),url(img/2.png),url(img/3.png);} 这段css ...

  2. css为网页顶部和底部都加入背景图

    网页背景图是我们常用的功能,一般来说.给网页加一个背景图,只要在网页的body标签中加入css属性就行. 代码如下:<body style="background-image:url( ...

  3. 前端之CSS列表及背景类属性

    一.列表类属性: 1.列表符号样式: list-style-type:disc(实心圆)|circle(空心圆)|square(实心方块)|decimal(数字)|none(去掉列表符号样式); 2. ...

  4. web前端学习(三)css学习笔记部分(3)-- css常用操作

    5.  CSS常用操作 5.1  对齐 使用margin属性进行水平对齐 <!DOCTYPE html> <html lang="en"> <head ...

  5. css — 定位、背景图、水平垂直居中

    目录 1. 定位 2. 背景图 3. 水平垂直居中 1. 定位 position:static | relative | absolute | fixed; static 静态定位 relative ...

  6. css常用样式属性详细介绍

    对于初学css的来说,肯定会觉得这么多样式不好记,而且记住了也容易忘,其实刚开始我们不用去记这么多的样式,确实是记了也会忘,刚开始只需记住一些常用的就可以了,然后在慢慢的使用过程当中接触并学习一些高级 ...

  7. Web前端篇:CSS常用格式化排版、盒模型、浮动、定位、背景边框属性

    目录 Web前端篇:CSS常用格式化排版.盒模型.浮动.定位.背景边框属性 1.常用格式化排版 2.CSS盒模型 3.浮动 4.定位 5.背景属性和边框属性 6.网页中规范和错误问题 7.显示方式 W ...

  8. html--前端css常用属性

    1.颜色属性 <div style="color:blueviolet">ppppp</div> 输入颜色英文单词 <div style=" ...

  9. css常用文本属性

    [CSS常用文本属性] 1. 字体.字号类: ① font-weight: 字体粗细. bold-加粗.normal-正常.lighter-细体 也可以使用100-900数值,400表示normal, ...

随机推荐

  1. Python 3.x pip安装报错ERROR: No matching distribution found for PIL

    安装完成即可解决无法引入PIL的问题.

  2. 数据库课程设计:SQL Server + Express + node.js + ejs 论坛管理系统

    前言 这是一篇对数据库课程设计的总结,这不是教程也不是指导,只是我的经验之谈,其中可能有许多错误,请小心,不要被误导.祝愿你看了这篇文章后能做出更好的设计. 我对web开发并不熟悉,而我们的课程设计只 ...

  3. moonlight不显示鼠标指针

    多显示屏导致moonlight不显示鼠标指针, 使用的时候关闭其他显示屏,只使用一个显示屏,就可以正常显示了.

  4. excel如何写宏?如何用按钮?

    注:本次测试版本 excel版本2019 写宏? 准备工作(使用宏的一切前提)===========文件-选项-自定义功能区 (勾选开发工具) 开始写宏=======右击sheet1--查看代码    ...

  5. Testflight无法接入App Store connect,对TF上架的应用会造成什么影响吗?

    感觉进入8月份以来,苹果也进入了多事之秋.不仅是App Store被下架,testflight也频频出问题,很多人反馈出现了Testflight无法接入App Store connect的问题,我们之 ...

  6. idea Maven项目 包下载不下来或者已经下载了就是飘红

    0.先在settings.xml加上阿里的镜像在刷新试试 <mirror> <id>aliyunmaven</id> <mirrorOf>*</m ...

  7. springboot-遇到的错误

    1.Field userMapper in com.yanan.outjob.controller.SysUserController required a bean of type 'com.yan ...

  8. Spring注解驱动开发01(组件扫描使用详解)

    使用Spring注解代替XML的方式 以前都是通过xml配bean的方式来完成bean对象放入ioc容器,即使通过@Aotuwire自动装配bean,还是要创建一个xml文件,进行包扫描,显得过于繁琐 ...

  9. Spring Security 入门学习--数据库认证和授权

    首先是使用的SpringBoot框架 基础需要的pom以来如下,基础的springboot项目的创建就不一一赘述了. <!--spring web--> <dependency> ...

  10. js对象数组新增、修改时的验证是否重复的逻辑

    JS代码: // 定义数据集合 const persons = [ { id: 1, name: '张三' }, { id: 2, name: '李四' } ] console.log('') con ...