自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(27)
  • 收藏
  • 关注

原创 css定位和滑动门

left:设置元素距离参照元素的左侧位移,正值往右,负值往左right:设置元素距离参照元素的右侧位移,正值往左,负值往右top:设置元素距离参照元素的顶部的位移,正值往下,负值往上bottom:设置元素距离参照元素的底部位移,正值往上,负值往下。我是图片的介绍我是图片的介绍我是图片的介绍我是图片的介绍我是图片的介绍我是图片的介绍我是图片的介绍我是图片的介绍我是图片的介绍我是图介。定位模式通过position属性来设置,以下为常用四种定位模式静态定位,相对定位,绝对定位,固定定位。

2023-02-27 21:13:43 138

原创 浮动的特性及使用

4.在浮动元素之后,与浮动元素呈并列关系的位置,加一个不浮动块元素(空的div标签(div本身不浮动,没有尺寸)),在空的div标签上加上属性:clear:both;概念:当样式声明发生冲突时,用户代理需要确定样式声明的最终值,既要考虑样式的来源又要考虑样式的特殊声明又要考虑优先级、以及先后顺序 ,这个过程就叫做层叠。文档中可以显示的对象在排列时所占的位置,实际上就是一个网页内标签正常从上到下,从左到右的排列,比如,块级标签会独占一行,行级标签会在一行显示。不浮动,默认值,并且会显示在其文本中出现的位置。

2023-02-27 21:12:25 136

原创 线性渐变 linear-gradient

background: linear-gradient(方向, 颜色1 范围1, 颜色2 范围2,...);方向:数值(单位deg)、关键词(left|right top|bottom)颜色:关键词、十六进制色值、rgb(r,g,b)、rgba(r,g,b,a)- to right bottom 方向朝向右下角。方向:加前缀需要把to去掉,方向是相反的。- to right top 方向朝向右上角。- to left bottom方向朝向左下角。- to top left 方向朝向左上角。

2023-02-27 21:06:10 181

原创 背景颜色绘制区域——background-clip属性

背景被裁剪到边框区域,在内容区、内填充区、边框区域显示,默认值。背景被裁剪到内填充区域,在内容区、内填充区显示。背景被裁剪到内容区域,仅在内容区域显示。

2023-02-27 21:05:02 123

原创 背景图定位区域——background-origin属性

默认值,背景图相对于内填充区域来定位。背景图片相对于边框区域来定位。背景图相对于内容来定位。

2023-02-27 21:03:56 122

原创 背景图尺寸设置

percentage:以父元素的百分比来设置背景图像的宽度和高度。第一个值设置宽度,第二个值设置高度。如 果只设置一个值,则第二个值会被设置为 “auto”。contain:包含,等比例缩放背景图片到完整显示在盒子中,有一边到达边界就停止放大, 可能导致另一边留白 但是背景图可能在区域范围内铺不满(宽高给大点)第一个值设置宽度,第二个值设置高度。如果只设置一个值,则第二个 值会被设置为 “auto”。cover:覆盖,等比例缩放背景图片到铺满整个盒子,但是背景图可能会无法完整显示在盒子中(宽高给大点)

2023-02-27 21:03:22 310

原创 2、文字阴影

text-shadow: x轴偏移量 y轴偏移量 模糊值 阴影颜色;h-shadow 必需,水平阴影的位置,允许负值;v-shadow 必需,垂直阴影的位置,允许负值;color 可选,阴影的颜色;blur 可选,模糊距离;

2023-02-27 21:01:09 32

原创 html5新特性

HTML5通过引入Geolocation的API可以通过GPS或网络信息实现用户的定位功能,定位更加准确、灵活。向后兼容, 就是本设备(或者软件)跟更老的设备比较, 是否可以读取更老设备的数据。向前兼容,就是指本设备跟更新设备比较, 是否可以读取更新设备产生的数据。canvas 元素使用JavaScript 在网页上绘制图像。新增了多媒体相关的video和audio元素。本地存储:提供两种客户端存储数据的方法。新增表单相关新元素、新属性。新增canvas元素。对本地存储的更好支持。

2023-02-27 21:00:21 31

原创 css3阴影

spread:阴影大小。正数阴影扩大(阴影大小大于盒子大小),负数阴影缩小(阴影大小小于盒子大小),0阴影与盒子同等大小。可选 单位: px。box-shadow: x轴偏移量 y轴偏移量 模糊值 阴影大小 阴影颜色 内阴影inset|外阴影(outset默认)h-shadow:阴影的水平偏移量。v-shadow:阴影的垂直偏移量。blur:阴影模糊度,不能取负数。可选 单位: px。inset:表示添加内阴影,默认为外阴影。当 spread 为0时,阴影大小与元素大小相同。

2023-02-27 20:59:49 43

原创 浏览器内核

imgsrc="./images/1.jpg"alt=""title="打架"width="300px"height="200px">定义文档的头部,包含文档的标题(title),可以包含文档脚本(script),样式(style),meta信息以及更多的其他信息。网址,本地文件,空链接(#占位,跳转到当前页的顶部),伪链接(href="javascript:"假链接,不跳转的)大部分国产的浏览器(qq浏览器,uc浏览器,猎豹浏览器,360浏览器)基本上是在IE浏览器的内核上进行的二次开发。

2023-02-27 14:14:18 119

原创 css3动画&2D|3D

css3动画库,预设了抖动(shake)、闪烁(flash)、弹跳(bounce)、旋转(rotateIn|rotateOut)、翻转(flip)、淡入淡出(fadeIn|fadeOut)等动画效果。animation: 动画名称 动画执行时间 动画速度曲线 延迟时间 动画播放次数 动画运动方向 动画结束之后显示的状态。a 指的是一个旋转角度值,如果为正值,元素围绕 Z 轴顺时针旋转;反之,如果为负值,元素围绕X轴逆时针旋转。a 指的是一个旋转角度值,如果为正值,元素围绕Y轴顺时针旋转;

2023-02-24 17:28:52 252

原创 什么是响应式设计

1、减少工作量,网站、设计、代码、内容都 只需要一份,多出来的工作量只是JS脚本、CSS样式做一些改变。响应式布局是根据设备屏幕宽度不同适当调整标签显示的布局,从而在每种设备屏幕宽度下呈现的界面是不同的。使用媒体查询针对不同宽度的设备进行布局和样式的设置,从而达到适配不同屏幕的目的。5、影响用户体验(一定程度上改变了网站原有的布局结构,会出现用户混淆的情况,)一个网站适配所有终端,实现不同屏幕分辨率下的终端上网页的不同布局;2、节省设计、开发、维护成本【不再特定的维护PC页面,移动页面】

2023-02-24 17:27:29 35

原创 animate.css动画插件

css3动画库,预设了抖动(shake)、闪烁(flash)、弹跳(bounce)、旋转(rotateIn|rotateOut)、翻转(flip)、淡入淡出(fadeIn|fadeOut)等动画效果。1、过渡动画是需要触发条件的(hover事件或click事件等),只能完成简单的动画。2、加统一的类名animated,然后选择自己想要的动画效果,然后复制粘贴。第一个animated是必须添加的样式名,第二个是指定的动画样式名。2、帧动画不需要任何的触发条件,可以完成复杂轨迹的动画。

2023-02-24 17:27:20 523

原创 响应时需要的技术

这个是针对ie8以上浏览器的一个属性,ie8以下无法识别。就是说ie8以上浏览器遇到这个属性会执行content的描述,大小写不敏感。1.虚拟窗口:创建虚拟窗口,自定义窗口的大小和缩放功能,能适应移动设备的屏幕大小。2.使用高版本的IE内核浏览器或者Chrome浏览器。可以根据设备显示器的特性,来设置不同的css的样式。2、使用媒体查询适配对应样式。

2023-02-24 17:26:55 66

原创 媒体查询的引入方式和语法

你看不见我,只能在打印设备才能看的见我哦

2023-02-24 17:22:19 180

原创 弹性盒侧轴对齐方式

* “默认值” 如果弹性子元素没有高度或者高度为auto,将占满整个容器的高度 *//* 默认值,子元素在侧轴的顶端的对齐 *//* 子元素在第一行文字的基线对齐 *//* 子元素在侧轴的末端对齐 *//* 子元素在侧轴的中间对齐 */

2023-02-24 17:20:57 73

原创 弹性盒侧轴对齐方式

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Doc

2023-02-24 17:17:54 66

原创 学学学学学学

但是士大夫大师傅少算多

2022-11-10 22:20:27 68

原创 学学习uxe

这些都是的方法v

2022-11-09 23:06:04 63

原创 学学学学学学

学学u学u下

2022-11-08 20:29:45 58

原创 好好学习呀

表格

2022-11-07 20:53:12 44

原创 html知识

学习一下html的认识

2022-11-02 22:09:34 48

原创 web前端

学习很快乐

2022-08-15 21:05:05 34

原创 好好学习。

好好学习太极

2022-08-15 19:29:26 60

原创 好好学习a

好好学习,天天向上

2022-07-14 00:06:27 61

原创 只要学不死就往死里学

今天学习很开心

2022-07-12 20:40:47 50

原创 何珊要学习,何珊要学习

学习太快乐了

2022-07-11 20:50:03 31

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除