css3的重点内容

news2025/1/11 14:52:25

css3的重点内容

浮动

父级边框塌陷问题

  1. 浮动的清除
clear:left; //清除左侧浮动
clear:right; //清除右侧浮动
clear:both; //清除两侧浮动

解决方案

  1. 增加父级元素的高度
  2. 增加一个空的div,之后清除浮动
  3. 通过overflow来进行相关元素的修剪
  4. 给父类添加相应的伪类元素 after。(当今最为成熟的清除浮动的方法)
.father:after {
    content: "";
    dispaly: block;
    clear: both;
}

定位

相对定位 relative

相对于原来位置进行相应偏移(属于标准流)

绝对定位 absolute (会产生相应的浮动)

  1. 在没有父级元素定位的情况下,其相对于浏览器进行定位**(子绝父相)**
  2. 其移动的范围是在父级元素的范围内进行移动

固定定位 fixed

固定在页面的某一个位置,不会随着页面的变化而变化

z-index

提高图层的权重,数字越大,越往上显示。

opacity展示背景的透明度

背景渐变的常用网站

image-20210901193017409

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/379899.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

使用 docker 部署 MySQL 会导致数据丢失吗

2023年2月28日,今天下午电话面试 java 岗位,经过一些提问后,面试官问了一个问题,“那么你最近在关注什么方面的技术点呢?”,可能是我之前的回答不太理想,且说辞都是“不好意思,可能最…

JS逆向-百度翻译sign

前言 本文是该专栏的第36篇,后面会持续分享python爬虫干货知识,记得关注。 有粉丝留言,近期需要做个翻译功能,考虑到百度翻译语言语种比较全面,但是它的参数被逆向加密了,对于这种情况需要怎么处理呢?所以本文以它为例。 废话不多说,跟着笔者直接往下看正文详细内容。…

狂飙狂飙,一年都沉浸在狂飙中,教你们用python来实现在图片中添加日历

前言 我是小废物,才开始看狂飙,这热点还能蹭上吗 该说不说,是真的很喜欢里面的大嫂啊,现在壁纸都一直是她,大美女谁不喜欢啊 昨天还是前天刷到了她出席活动,太帅了吧 不多说,先看大美女 &am…

【面试1v1实景模拟】Redis面试官会怎么提问?本文助你面试入坑,赶快收藏吧~

笑小枫专属目录老面👴:小伙子,咱来聊聊Redis,你知道什么是Redis吗?老面👴:除了key-value类型的数据,你还知道Redis的哪几种数据结构?老面👴:你说说在什么场景下使用了R…

taobao.opensecurity.uid.get( open security uid 获取接口 )

¥免费不需用户授权 根据明文 taobao user id 换取 app的 open_uid 公共参数 请求地址: HTTP地址 http://gw.api.taobao.com/router/rest 公共请求参数: 公共响应参数: 点击获取key和secret 请求示例 TaobaoClient client new DefaultTaobaoClient(url, appkey, …

2023年湖北助理工程师(初级职称)怎么评?需要什么资料?启程别

2023年湖北助理工程师(初级职称)怎么评?需要什么资料?启程别 助理工程师主要是指初级工程技术人员的职务名称,他是通过相关考试和相关部门评审通过之后所获得的相应名称,想要了解职称更多相关资料可以咨询启…

使用字典快速输入编号(匹配编码表)

实例需求:在A列输入样品名称之后,在B列字段填写编号,其规则如下: 如果A列已经存在相同样品名称,则将编号递增,例如:A15输入沥青,最后一行相同样品名称在第12行,B15填写递…

第十届蓝桥杯省赛——4质数(质数判断,数学函数:开方函数)

题目:试题 D: 质数本题总分:10 分【问题描述】我们知道第一个质数是 2、第二个质数是 3、第三个质数是 5……请你计算第 2019 个质数是多少?【答案提交】这是一道结果填空的题,你只需要算出结果后提交即可。本题的结果为一个整数&…

环形缓冲区(c语言)

1、概念介绍 在我们需要处理大量数据的时候,不能存储所有的数据,只能先处理先来的,然后将这个数据释放,再去处理下一个数据。 如果在一个线性的缓冲区中,那些已经被处理的数据的内存就会被浪费掉。因为后面的数据只能…

使用码匠连接一切|二

目录 Elasticsearch Oracle ClickHouse DynamoDB CouchDB 关于码匠 作为一款面向开发者的低代码平台,码匠提供了丰富的数据连接能力,能帮助用户快速、轻松地连接和集成多种数据源,包括关系型数据库、非关系型数据库、API 等。平台提供了…

软测入门(一)测试理念及基础知识

软测入门理念 软件的分类 按层次划分:系统软件、应用软件按组织划分:商业软件、开源软件按结构划分:单机软件、 软件缺陷 由来 Grace Hopper发明Cobol计算机语言,也是找出电脑程序中第一个bug的女程序员 BugDefect 定义 软…

Kafka面试问题总结

kafka架构2.基础概念Producer(生产者) : 产生消息的一方。Consumer(消费者) : 消费消息的一方。Broker(代理) : 可以看作是一个独立的 Kafka 实例。多个 Kafka Broker 组成一个 Kafka Cluster。同时&#x…

SpringBoot整合

14-SpringBoot整合Junit 搭建SpringBoot工程 引入starter-test起步依赖 <dependencies><dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter</artifactId></dependency><dependency>&…

化繁为简高效部署 华为云发布部署服务CodeArts Deploy

​随着互联网、数字化的发展&#xff0c;公司机构与各类企业往往需要进行大量频繁的软件部署&#xff0c;部署设备类型多样&#xff0c;如&#xff1a;本地机器、云上裸金属服务器、云上虚拟机与容器等。面对多种部署模式、分布式复杂运行环境&#xff0c;如何用最短时间、高质…

2021年NOC复赛真题解析

本题来自2021年NOC创新编程复赛操作题。阿短是一位小学五年级学生,本学期即将结束,阿短打算创作一个能够进行四则运算练习的出题程序。程序能够随机出10道题,题目皆是一位数的加减乘除四则运算,每答对一题得1分。请你帮助阿短,编写出这个程序吧。 1.参与运算的两个数值都…

分享5款Windows同类软件中的翘楚

今天要给大家推荐的是5款软件&#xff0c;每个都是同类软件中的个中翘楚&#xff0c;请大家给我高调地使用起来&#xff0c;不用替我藏着掖着。1.沙盒工具——Sandboxie Sandboxie是一个电脑必备的沙盘工具&#xff0c;对于从网上下载的软件安装包、文件、视频、图片等等一切不…

一道阿里类的初始化顺序笔试题

问题很简单&#xff0c;就是下面的代码打印出什么&#xff1f; public class InitializeDemo {private static int k 1;private static InitializeDemo t1 new InitializeDemo("t1" );private static InitializeDemo t2 new InitializeDemo("t2");priv…

硬件工程师常见问题与答疑

在工作中&#xff0c;尤其是做了很多年的&#xff0c;有些问题可能不知道&#xff0c;又不好意思问&#xff0c;怕别人说你连这个都不知道&#xff1f;很尴尬&#xff0c;而且百度又搜不到&#xff0c;本博主收集了很多答疑&#xff0c;希望里面有对你有用的&#xff0c;或者是…

linux修改DNS 系统版本Kylin V10桌面版

配置DNS在银河麒麟桌面操作系统V10 SP1 中修改DNS信息&#xff0c;直接修改/etc/resolv.conf文件中的DNS信息&#xff0c;不能生效。应该参考如下步骤&#xff1a;一、首先修改 /etc/systemd/resolved.conf文件&#xff0c;在其中添加DNS信息在终端中执行以下命令&#xff1a;s…

零基础机器学习做游戏辅助第十五课--原神自动钓鱼(五)完整效果

一、先上效果 二、整理思路 我们现在已经具备了所有需要的技术,我们梳理出所有技术的流程。 判断当前钓鱼状态(未抛竿、已抛竿、上鱼中)。未抛竿,截图并识别图中所有鱼类,选择其中一个种类。根据以选择鱼类选择对应鱼饵。<