前端小白奋斗史07

article/2025/6/24 16:41:40

em 倾斜标签

ins 下划线标签

alter 替换文本

title 提示文本

target 目标窗口弹出方式 _blank _self

锚点链接 快速定位页面位置

特殊标签
空格 &nbsp 你不是胖
< &it
> &gt

element语法

父子记关系标签 ul>li

兄弟级关系标签 div+p

类名有顺序的 $自增符号

快速格式化代码 shift+alt+f

Css选择器 基础选择器 复合选择器

基础选择器 标签选择器 id选择器 类选择器 通配符选择器

复合选择器 后代选择器 空格
子选择器 >
伪类选择器 :
并集选择器 ,

伪类选择器 :focus 选取获得焦点的表单元素

:link 未被访问的元素出来

:visiter 被访问过的选取出来

:hover 鼠标经过时被点亮

:active 鼠标按下未抬起

元素显示模式 块元素 行内元素 行内块元素

  • 转换为块元素 display:block
  • 转换为行内元素 display:inline
  • 转换为行内块元素 display:inline-block

单行文字垂直居中 文字的行高等于盒子高度

Css背景 背景颜色 (透明 transparent 背景平铺(repeat)背景图片 背景固定background-attachment:scroll
Fixed背景位置

Css三大特性 层叠性 继承性 优先级

优先级 继承性和*<标签选择器<类选择器<id选择器<伪类选择器<行内样式style<!important

注意权重值

盒子模型
在这里插入图片描述

内边距 边框 外边距

边框颜色 bordet-color

边框位置 上下左右

边框类型 border-style:none solid实线 dashed虚线 dotted点线

表格细线边框 border-collapes:collapes

边框会增加盒子大小

量盒子大小事不量边框

如果量边框宽高减去边框宽度

内容和盒子用内边距

盒子和盒子用外边距

注:盒子有了宽度和高度,加内边距会撑大盒子

外边距可以让块元素水平居中 Margin:0 center

行内元素或行内块元素水平居中给父元素添加text-align:center

相邻块元素只需要给一个外边距,不要会出现塌陷和合并
在这里插入图片描述
在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

圆角边框 border-radius:length|百分比

length为圆角半径

Css3

盒子阴影

box-shadow:h-shadow水平阴影 v-shadow垂直阴影 blur模糊距离 spread阴影尺寸 color阴影颜色 insert没阴影

水平阴影和垂直阴影必须写

注意 默认为outsert外阴影 不可以写 不然阴影无效 盒子阴影不占空间,不阴影其他盒子排列

文本阴影
text-shadow:shadow水平阴影 v-shadow垂直阴影 blur模糊距离 color阴影颜色

Css传统三大布局 普通流(标准流)浮动 定位
在这里插入图片描述
在这里插入图片描述

清除浮动后父集就会根据浮动的子盒子自动的检测高度,父集有了高度,就不回影响下面标准流的

  • 清除浮动

在这里插入图片描述

- 清除浮动方法

- 额外标签法

- 父集添加overfloat:hidden :after

- 伪元素清楚浮动 双伪元素清楚浮动


http://chatgpt.dhexx.cn/article/PlbRGuFZ.shtml

相关文章

学艺不精,总是掉坑!前后端分离历险记

Spring Boot Vue 这一对技术栈目前看来可以说是非常的火热,关于 Spring Boot 松哥已经写过多篇教程,如: 40 篇原创干货,带你进入 Spring Boot 殿堂! 前后端分离的文章也写过好几篇了,例如: 一个…

测试4年裸辞失业,面试17k的测试岗被按在地上摩擦,结局让我崩溃大哭...

作为IT行业的大热岗位——软件测试,只要你付出了,就会有回报。说它作为IT热门岗位之一是完全不虚的。可能很多人回说软件测试是吃青春饭的,但放眼望去,哪个工作不是这样的呢?会有哪家公司愿意养一些闲人呢?…

一名【合格】前端工程师的自检清单,劝退指南 >_<

到现在为止,前端工程师已经成为研发体系中的重要岗位之一。可是,与此相对的是,我发现极少或者几乎没有大学的计算机专业愿意开设前端课程,更没有系统性的教学方案出现。大部分前端工程师的知识,其实都是来自于实践和工…

测试4年裸辞失业,面试17k的测试岗被按在地上摩擦,结局让我崩溃大哭....

作为IT行业的大热岗位——软件测试,只要你付出了,就会有回报。说它作为IT热门岗位之一是完全不虚的。可能很多人回说软件测试是吃青春饭的,但放眼望去,哪个工作不是这样的呢?会有哪家公司愿意养一些闲人呢?…

Linux文件导入gitee仓库中

文章目录 零.前言1.在gitee中建立仓库2.向Linux系统中导入仓库3..gitignore4.总结 零.前言 本文将介绍如何将Linux中的文件存入gitee的仓库中,由于github时常登不上去,所以国内推荐gitee。 1.在gitee中建立仓库 首先我们先注册一账号,这里…

年少成名的我并没有放弃自己,谁敢说她\他文章比我写的好?!,不服来战!

大家镇定一下情绪,文章要开始了。 不择手段是人杰,不改初衷是英雄! 年前读了老罗的这本书—— 《一个理想主义者的奋斗,The Adventures of an Idealist》回想起了我与新东方的故事 我与新东方的故事,大砥开始于高二…

小黑抱紧沛奇老师课程的大腿,继续学习git的日常积累:沛奇老师git笔记(git命令与分支)

课程链接 https://www.bilibili.com/video/BV1Ud4y1k715?p4&vd_source0b1383084f626b5cf37be3e82e883106 git入门 进入要管理的目录git init 初始化,即:让git帮助我们管理当前文件夹git status 检测当前文件目录下文件的状态三种状态变化 红色:新增的文件/修改了老文件…

后端开发——Flask框架从入门到入坟(终章)

前言 前面已经将Flask框架的内容基本梳理完了,在这篇文章中荔枝会将Flask的部署上云的步骤跟大家分享一下,其实也是基于宝塔页面来进行配置的啦哈哈哈。荔枝也会将环境配置命令和数据库迁移步骤分享出来,下面就由荔枝把具体的操作梳理出来吧哈…

数字电路逻辑设计_第三版_微课版_第五章思考题与练习题(附答案)

1. 触发器具有哪些基本特征? 答: 触发器的基本特征: (1)有两个稳态,可分别表示二进制数码0和1无外触发时可维持稳态; (2)外触发下,两个稳态可相互转换(称翻转…

数电基础复习(一)

电信号: 模拟电信号:电压或电流的幅值随时间连续变化数字电信号:电压或电流在幅值和时间上都是离散的(可以是多值逻辑,一般采用二值逻辑) 主要参数: 幅值:高电平的电压值上升时间…

数电设计-八路抢答器

1 设计要求 设计一个能支持八路抢答的智力竞赛抢答器;主持人按下开始抢答的按键后,有短暂的报警声提示抢答人员抢答开始且指示灯亮表示抢答进行中;在开始抢答后数码管显示30秒倒计时;有抢答人员按下抢答键后,在数码管…

模电/数电考核试题

目录: 西安交通大学17年3月课程考试《模拟电子技术》考核试题 西安交通大学17年3月课程考试《数字电子技术》考核试题 附录 -------------------------------------------------------------------------------------------- 西安交通大学17年3月课程考试《模拟…

[答案解析]华工数电实验:简易交通灯控制电路的设计

题目: 答案: 工程文件下载:https://github.com/BlademasterQAQ/A-simple-traffic-signal-lamp-in-digital-electronic-technology 用3个JK触发器实现的3位二进制计数器电路: 仿真结果:(此为上升沿触发时的仿…

【数电基础复习】

数字电子技术——概念向 数制和码制数字量与模拟量位权十-二进制运算反码、补码奇偶校验 逻辑函数逻辑代数运算最小项和最大项逻辑函数化简方法 门电路CMOS门电路CMOS反相器CMOS电压传输特性和电流传输特性CMOS反相器静态输入特性和输出特性CMOS反相器的动态特性CMOS与非门、或…

【数电】数字电子技术学习练习

一、 选择题:(共20分,每小题2分) 1、逻辑函数的所有最小项之和等于多少? A. 0 B. 1 C. 0或1 D. 任意值 2、与非门的多余输入端应如何处理?…

Java可变类型与不可变类型

一、可变类型(mutable type)与不可变类型(immutable type) 已知,基本数据类型都是不可变类型;引用(对象)数据类型既有可变类型,也有不可变类型 首先区分:改变…

Python中的可变对象

文章目录 可变对象与不可变对象关于对象图解可变对象 可变对象与不可变对象 关于什么是对象不是这篇的重点,可查看这篇 Python中面向对象的简单应用 可变对象就是说对象的值是可以改变的,序列中可变对象有list 不可变对象有str、tuple 那么问题又来了…

可变剪切|rmats

可变剪切 可变剪切(或选择性剪切)是一个过程,即主要基因或者mRNA前体转录所产生的RNA的外显子以多种方式通过RNA剪切进行重连。由此产生的不同的mRNA可能被翻译成不同的蛋白质构体,因此,一个基因可能编码多种蛋白质。 rmats 下面是小编使用…