- 博客(13)
- 收藏
- 关注
RSS订阅原创 移动端适配
视口:就是浏览器显示页面内容的屏幕区域视口分为: 布局视口 视觉视口 理想视口布局视口:一般移动端设备的浏览器都默认设置了一个布局视口,为了解决早期pc端页面在移动端上的显示问题苹果 安卓 基本上设置这个视口的分辨率980px视觉视口:你看到的网页区域,指的是网址的区域通过缩放去操作视觉视口不会影响布局视口 理想视口: 1: 是网站在移动设备的浏览器中最理想的一状态(浏...
2020-03-24 23:21:53
117
原创 径向渐变的属性和值
径向渐变:(一定要加浏览器前缀)从一个点到四周的渐变 background:-webkit-radial-gradient(渐变位置,形状,大小,颜色1,颜色2,颜色3); 渐变位置: 默认从中心到四周 left 从左边到四周的渐变 right top bottom left top 从左上角到四周的渐变 left botto...
2020-03-24 00:03:05
315
原创 线渐变的各种属性和值
线性渐变:background: -webkit-linear-gradient(方向,颜色1,颜色2,颜色3,…颜色n);background: linear-gradient(to 方向,颜色1,颜色2,颜色3,…颜色n); 1 单一方向渐变: left 从左边开始 right 从右边开始 top 从上边开始 bottom 从底部开始 注意: 需要添...
2020-03-24 00:02:02
257
原创 响应式布局的优缺点
响应式布局绝大部分项目:PC端 ~~> 官网移动端 ~~> 移动端网页,app,小程序… 响应式布局: 为了适应不同的设备,分辨率 不同的设备(pc电脑端 平板电脑 手机端) x 宽度 500px<= x <800px css 1 800px<= x <1000px css 2 1000px<...
2020-03-23 23:58:42
1075
原创 定位position各种属性
定位:positionstatic 默认值,设置坐标无效absolute 绝对定位特征:1:脱离文档流,不占位置2: 默认参考html的00点(浏览器零点)3: 如果有父级,且父级有定位,那就参考父级元素(默认定位除外) 相当于给子元素指定了参考物坐标位置 ：水平 left right垂直top bottom relative: 相对定位 特征: 1: 占据文...
2020-03-23 23:56:38
90
原创 3D动画 旋转木马案例
</head><body> <div id="box"> <ul class="ff"> <li><img src="img1/1.jpg" alt="#"></li> <li><img src="img1/2.jpg" alt="#">&l...
2020-03-23 23:52:27
344
原创 CSS3中各种定位属性
定位:positionstatic 默认值,设置坐标无效absolute 绝对定位特征:1:脱离文档流,不占位置2: 默认参考html的00点(浏览器零点)3: 如果有父级,且父级有定位,那就参考父级元素(默认定位除外) 相当于给子元素指定了参考物坐标位置 ：水平 left right垂直top bottom relative: 相对定位 特征: 1: 占据文...
2020-03-22 20:23:15
477
原创 新增选择器
选择器(选择符):id class 类型(div span…) 后代选择器 伪类选择器 伪元素选择器… 属性选择器: e[attr] 选中e元素,且e元素有attr属性 e[attr="value"] 选中e元素,且e元素有attr属性,值为value e[attr~="value"] 选中e元素,且e元素有attr属性,包含值value e[attr^="value...
2020-03-22 20:22:05
116
原创 css3中的2D和3D的各种属性和值
css3中的2d二维的平面空间 css3 2d属性 变形属性 transform:; 2d变换: 位移 transform:translate(); 旋转 transform:rotate(); 缩放 transform:scale(); 倾斜 transform:skew();位移:transform:translate(水平位移,...
2020-03-21 20:33:24
405
原创 弹性盒布局的各种属性和值
弹性盒布局:display:flex; display:inline-flex;(两个元素会在一行显示)作用: 控制子集在"主轴"上排列显示规则:所有的子元素都会在主轴上排列默认x为主轴如果设置x为主轴,那y为侧轴如果设置y为主轴,那么x为侧轴设置方法: 父元素必须为弹性盒 display:flex; 设置为display:flex; 1: 弹性盒,子元素默认在主轴排列,默认...
2020-03-20 23:32:49
786
原创 iconfont字体图标三中引入方式
**iconfont字体图标三中引入方式**加粗样式****方式一: 在本地引入1: 去官网下载2: 在页面引入外部css文件3: 挑选对应的类名方式二:在线引入1: 在页面引入链接地址2: 挑选对应的类名3: 去官网下载4: 修改引入css文件的路径彩色图标:1: 引入外部iconfont.js文件2: 在style中添加....
2020-03-20 01:18:45
335
原创 2020-03-18
***HTML中各种选择器和伪类***选择器(选择符): id class 类型(div span…) 后代选择器 伪类选择器 伪元素选择器… 属性选择器: e[attr] 选中e元素,且e元素有attr属性 e[attr=“value”] 选中e元素,且e元素有attr属性,值为value e[attr~=“value”] 选中e...
2020-03-18 23:20:33
92
原创 2020-03-18
animation 动画 不需要事件触发,使用关键帧就可以执行 1: 定义动画 from{}起始位置 to{}终点位置 0%{}起始位置 25%{}过程1 …过程n 100%{} 终点位置 2: 调用动画 animation-name:;关键帧名字 动画名 animation-duration:;关键帧时...
2020-03-18 10:51:27
83
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人