本文目录圆角盒子滑动门山顶角多重背景图片圆角边框下拉阴影盒阴影图片替换明日份牛粪本文首发于图灵教育微信本文作者:李松峰
原创
2023-07-26 10:17:59
88阅读
今天学习的是如何使用div盒子模型做一个具有多边形旋转放大的一个基础特效页面。需求分析:1、多边形如何生成;使用css3中的transform属性对元素进行旋转 2、使用background:rgba设置半透明属性所遇到的问题:1、样式图片不能位于中间?解决方案采用自适应布局将top left right buttom都设置为零外边距mar
原创
2017-07-22 20:27:54
617阅读
/* 飞机飞行 */ .plane { position: absolute; top: 18%; left: 13%; -webkit-animation: flying 15s linear infinite; animation: flying 15s linear infinite; z-index: 30; } @keyframes flying { 0% {top: 100px;lef
转载
2019-11-09 13:41:00
164阅读
2评论
半透明边框 background-clip: 规定背景的绘制区域 .div { width: 200px; height: 200px; background: blue; border: 10px solid rgba(255, 170, 170, 0.3); background-clip: p
转载
2020-05-31 18:26:00
56阅读
前言: I come back. 记一些CSS属性总结(一
转载
2022-04-13 11:01:53
25阅读
事因 网站中的遮罩层大都有一个问题,就是在这个遮罩层中滑动,里面的内容也会跟着滑动,我是这样想的,既然都有这个问题,干脆写一个通用的插件出来,省的每个还得单独处理。如果是单独处理这个问题是比较好解决的,关键问题是,我想写的这个插件是,你直接在有问题的页面中引入这个插件就行,而不需要做其他的任何事情,
原创
2021-08-04 11:35:00
152阅读
【目录】一、CSS基础1、什么是CSS3,如何学习?2、CSS的注释方法3、CSS语法结构4、CSS的四种引入方式二、CSS选择器1、基本选择器2、组合选择器3、群组选择器4、序列选择器5、属性选择器6、伪类选择器7、伪元素选择器8、CSS三大选择器9、选择器优先级 一、CSS基础1、什么是CSS3,如何学习?CSS3 就是 CSS(Cascading Style Sheet )语言,也属于标记语
转载
2021-04-30 20:29:24
268阅读
2评论
【目录】一、布局相关的标签二、盒子模型三、浮动四、定位(有个即刻偷师学艺的方法——在浏览器里,打开一个设计很棒的网页,鼠标点击右键,选择“检查”,即可查看网页的HTML+CSS代码和相对应的布局位置调试自己写的网页时,也可以使用“检查”直接修改代码)一、布局相关的标签# 布局都是用块级元素,而行内元素是控制内容显示的。1、div标签
一般用于配合css完成网页的基本布局2、span标签
转载
2021-04-30 20:28:26
143阅读
2评论
什么是原子CSS不同于大家常用的BEM这类规则,原子css就是拆分,所有 CSS 类都有一个唯一的 CSS 规则。例如如下.w-full{ width:100%;
}.h-full{ height:100%;
}复制代码而像这种就不是.w&h-full{ width:100%; height:100%;
}复制代码当我们使用的时候,直接写class名就可以<html>&
转载
2021-01-19 17:16:32
5119阅读
2评论
一、表单标签
在很多网站的登录页上,都会有如下图的界面图片 来自mt论坛登录页的作用毫无疑问是收集用户信息并进行登录态的跳转,那么我们怎样才能做出这样的界面呢?这就涉及到了表单标签的定义。首先观察页面,是由title加上输入框组成的,那么我们就先构建出来这样一个页面附:在大多数编辑器中html:5可以实现快速输入那么负责输入用户名和密码的输入框该如何处理,这就涉及到了<input>标签
原创
2022-09-20 22:22:15
240阅读