css-盒子等样式学习

news/2024/11/29 9:36:26/

盒子居中,继承外层盒子的宽高

兼容性(border-box)将边框收到盒子内部

初始化div     不用管box-setting 

content-box 还原

创建为一个类 ,让所有需要还原的类 进行继承

padding 用法表示margin上下左右边距

body  外边距(IE8 默认上下16px,左右8px) (IE7  上下11px 。。。。)各个浏览器不同

常规项目设计定位方式

relative 数据非定位元素  position 数据定位元素 

position  创建新图层  ,box2  还在原来的图层所以 橘色再黑色下面 

z轴处理图层问题

页面自适应2栏布局

overflow-y  让其失去滚动条

左边自适应,html,body要同时继承以上属性,不然就没有效果

 float能将图片浮动在文字中

 清除浮动方法一(将span变为p)span { clear:both}

float  以后就变成内联块元素

必须两边都加上浮动

 

 :伪类用法 

::伪元素content  必须有    inline-block 可以变成块级元素

清楚浮动的方法

将边框收进元素中

动态获取数据

   向里扩散

 将阴影遮挡去掉,可以将header 网上移动  用relative + z-index

浏览器兼容性

纯园   50%   半圆角  height/2 +px      圆角直接用px

 保持图片缩放(位置)不变

图片自适应

contian同样达到如此效果

背景图片设置不滚动

复合使用

log 配置,如果没有网速则显示字符    实际是将logo-hd 变为块级  然后图片设置logo  同样的高度和宽度 利用overflow  hidden 达到效果

border='1'   有单元格  与  style 没有单元格的区别

 

 保持宽度一致

解决浮动撑开的问题   BFC特性

可解决该问题。

父级元素出发BFC也能解决margin塌陷

css 样式基本顺序

命名规范

学习链接  fontawesome、矢量图标、雪碧图、腾讯课堂案例_哔哩哔哩_bilibili


http://www.ppmy.cn/news/1324077.html

相关文章

【期末总复习】计算机视觉理论与实践

1、计算机视觉的三大任务 分类、检测(定位)、分割(语义和实例) 2、生成对抗网络的基本概念 生成对抗网络GAN是一种用于生成模型的机器学习框架。它由两个主要组件组成:生成网络和判别网络。生成网络试图生成与真实数…

外部配置文件和Class打包到jar 然后重新启动java -jar

我这边以bpvs-backend-2.0.0-SNAPSHOT.jar和application-dev.properties配置文件为例 一.将DeviceDataService.class和DeviceDataPushTOSEventListener.class替换到jar内部 步骤1:解压原始bpvs-backend-2.0.0-SNAPSHOT.jar 将两个class文件拷贝到jar目录下后cd到文…

使用java内置工具jar手动创建xxx.jar文件

平时我们一般都是在IDE工具中使用插件打包JAVA项目为 XXX.jar文件, 其实这个工作我们手动也可以完成, 也非常简单, 使用JDK自带的jar命令行工具即可. 用法: jar {ctxui}[vfmn0PMe] [jar-file] [manifest-file] [entry-point] [-C dir] files ... jar用法示例 创建 jar: …

Linux消息队列

常用函数 //创建/获取消息队列 int msgget (key_t key, int msgflg); /* key : 为键值,ftok(); msgflg:IPC_CREAT - 创建,不存在即创建,已存在即获取,除非… IPC_EXCL - 排斥,已存在即失败。 */// 向消息队列发送消息 int msgs…

如何绘制出图像的色素分布直方图

效果 如图,可以展示出我们的图像的颜色分布直方图,表明的图像的亮和暗 实现可视化色素分布直方图方法 这里我们对我们的灰色图片和彩色图片进行了直方图显示 import cv2 import matplotlib.pyplot as plt image cv2.imread("test.jpg") # 彩色图片->…

【计算机硬件】2、指令系统、存储系统和缓存

文章目录 指令系统计算机指令的组成计算机指令执行过程指令的寻址方式(怎么样找到操作数?)1、顺序寻址2、跳跃寻址 指令操作数的寻址方式(怎么样找到操作数?)1、立即寻址方式2、直接寻址方式3、间接寻址方式…

Win10如何设置闹钟提醒?win10电脑自定义闹钟提醒的方法

上班族在繁忙的工作中,有时候需要在电脑上设置醒闹钟提醒,以确保按时完成工作或者提醒自己关注某些事项。想想一下,你在某一天需要参加一个重要的会议,为了不错过会议的开始时间,设置一个电脑上的醒闹钟提醒是十分必要…

游戏引擎支持脚本编程有啥好处

很多游戏引擎都支持脚本编程。Unity、Unreal Engine、CryEngine等大型游戏引擎都支持使用脚本编写游戏逻辑和功能。脚本编程通常使用C#、Lua或Python等编程语言,并且可以与游戏引擎的API进行交互来控制游戏对象、设置变量、执行行为等。使用脚本编程,游戏…