E-COM-NET
首页
在线工具
Layui镜像站
SUI文档
联系我们
推荐频道
Java
PHP
C++
C
C#
Python
Ruby
go语言
Scala
Servlet
Vue
MySQL
NoSQL
Redis
CSS
Oracle
SQL Server
DB2
HBase
Http
HTML5
Spring
Ajax
Jquery
JavaScript
Json
XML
NodeJs
mybatis
Hibernate
算法
设计模式
shell
数据结构
大数据
JS
消息中间件
正则表达式
Tomcat
SQL
Nginx
Shiro
Maven
Linux
WEB前端入门
web前端入门
到实战:纯CSS表头固定
纯CSS实现表头固定之所以难,主要在两点。一是占有最大市场份额的IE6不支持position:fixed。另一个,是人们想破头都想在一起表格中实现这种效果。不过外国真的人用纯CSS实现了这种效果,动用了数量惊人的CSShacks……我觉得,如果搞到代码如此难懂且难扩展,还不如用javascript好了。碰巧今天我也遇到这种需求,换个视角想想,真的搞出来了。我们知道,CSS是负责表现,HTML是负责
魔方编程
·
2020-06-29 17:21
web前端入门
到实战:css3 绘制画圆、扇形
css已经越来越强大了,可以使用它来绘制各种简单的形状,用于代替图片显示,这次的分享主要用到画圆,扇形实现圆形.circle{border-radius:50%;width:80px;height:80px;background:#666;}效果如下:border-radius圆角的四个值按顺序取值分别为:左上、右上、右下、左下。这里只设置一个值,代表四个角的取值都为为50%原理:border-r
魔方编程
·
2020-06-29 17:21
web前端入门
到实战:css实现盒尺寸重置、均匀分布的子元素、截断文本
盒尺寸重置重置盒子模型,以便widths和heights并没有受到border还是padding他们的影响。代码实现:html{box-sizing:border-box;}*,*::before,*::after{box-sizing:inherit;}效果如下:说明box-sizing:border-box添加padding或者border不影响元素的width或者height。box-siz
魔方编程
·
2020-06-29 17:21
web前端入门
到实战:纯CSS实现柱形图
CSS在处理排版之强大,没有做不到,只有想不到。下面我们将一同实现一个柱状图。先打好一个具体的框架。我们利用无序列表做整体,里面的东西我们根本选择内联无素span,strong,em来填充。使命召唤:35%机器战争:40%CS:87%光环:45%半条命:23%解释一下,ul里面的每一个li就代表我们要统计的内容,span为柱身,em为统计项的名字,strong为统计数值。我们可以添加一些背景颜色来
魔方编程
·
2020-06-29 17:21
web前端入门
到实战:24个 CSS 高级技巧合集
列表:1.使用CSS复位2.继承box-sizing3.使用unset而不是重置所有属性4.使用:not()选择器来决定表单是否显示边框5.为body元素添加行高6.為表單元素設置:focus7.垂直居中任何元素8.逗号分隔的列表9.使用负的nth-child来选择元素10.使用SVG图标11.使用“形似猫头鹰”的选择器12.使用max-height来建立纯CSS的滑块13.创造格子等宽的表格14
魔方编程
·
2020-06-29 17:21
web前端入门
到实战:css3实现ps蒙版效果以及动画
css3越来越强大,使用css也可以做越来越多意想不到的效果。css3实现了ps的蒙版效果,炫酷叼炸天的技能,必须要分享出来啊!实现原理这个动画,其实也并不复杂。它使用background-clip实现了文字蒙版的效果,然后结合了背景图片的animation实现了如上图所示的文字蒙版动画。用css3做蒙版效果常见的有两种,一种是图形的,另一种是文字的。图形蒙版这里要使用的到时clip-path,它
魔方编程
·
2020-06-29 17:21
web前端入门
到实战:用css3实现惊艳面试官的背景即背景动画(高级附源码)
我们传统的前端更多的是用javascript实现各种复杂动画,自从有了Css3transition和animation以来,前端开发在动画这一块有了更高的自由度和格局,对动画的开发也越来越容易。这篇文章就让我们汇总一下使用Css3实现的各种特效。1.实现内部虚线边框知识点:outline核心代码.dash-border{width:200px;height:100px;line-height:10
魔方编程
·
2020-06-29 17:20
web前端入门
到实战:详解css3如何给背景图片加颜色遮罩
前段时间在开发中,遇到需要给背景层加颜色遮罩的项目,现在特定总结一下给背景图层加颜色遮罩的方法。方法一:通过定位叠加(注意层级).wrap1{position:relative;width:1200px;height:400px;background:rgba(0,0,0,.5);}.wrap1.inner{position:absolute;left:0;right:0;top:0;bottom
魔方编程
·
2020-06-29 17:20
web前端入门
到实战:CSS导航条菜单:带小三角形
很多网页的导航条都会有小三角形,其实实现这个功能也挺简单。拿菜鸟教程首页导航做个例子首先写一个大的div_nav,而“首页”“菜鸟笔记”“菜鸟工具”“参考手册”等则作为div包含在div_nav中。div_nav背景色设置为对应的颜色。背景色的设置代码如下:.blue#slatenavullia:hover,.blue#slatenavullia.current{color:#fff;backgr
魔方编程
·
2020-06-29 17:20
web前端入门
到实战:css绘制各种形状图形
虽然我们现在大都使用字体图标或者svg图片,似乎使用CSS来做图标意义不是很大,但怎么实现这些图标用到的一些技巧及思路是很值得我们的学习。一、实心圆.circle{width:120px;height:120px;background:#8BC34A;border-radius:100%;}二、圆环(空心圆).ring{width:100px;height:100px;border:10pxsol
魔方编程
·
2020-06-29 17:20
web前端入门
到实战:css骚操作之表单验证
效果图原理表单元素中,有一个pattern属性,可以自定义正则表达式(如手机号、邮箱、身份证…);valid伪类,可以匹配通过pattern验证的元素;invalid伪类则相反,可以匹配未通过pattern验证的元素;于是就可以随便搞啦,上面的效果图只是做一些简单的效果,更多效果以及限制大家就发挥自己的想象力咯;html布局很简单,input跟button是兄弟节点的关系,required属性是必
魔方编程
·
2020-06-29 17:20
css
前端
前端开发
前端基础
web前端
web前端入门
到实战:css实现文字竖排的方式
html中文字的默认排列是横向排列的,但一些特殊情况下是需要文字竖向排列的。单行文字竖向排列.onecn{width:20px;margin:0auto;line-height:24px;}.oneen{width:15px;margin:0auto;line-height:24px;font-size:20px;word-wrap:break-word;/*英文的时候需要加上这句,自动换行*/w
魔方编程
·
2020-06-29 17:20
web前端入门
到实战:CSS3 filter(滤镜)属性
css3的滤镜filter属性,可以对网页中的图片进行类似Photoshop图片处理的效果,例如背景的毛玻璃效果、老照片(黑白照片)、火焰效果等。一、blur(px)高斯模糊二、brightness(%)亮度三、contrast(%)对比度四、drop-shadow()阴影注意:这个drop-shadow与box-shadow都是在说阴影,但还是有区别的,看下图图中火焰的图片,是一张png图片,除
魔方编程
·
2020-06-29 17:20
web前端入门
到实战:css 让一个盒子的高度自适应屏幕剩余的部分
在项目中,移动端要自适应,由于有时候数据不够,所以导致了有的区域空白要求:没有数据的时候能够充满屏幕,数据超出屏幕就出现滚动条做法1-让容器高度充满这个屏幕在容器内容很少的情况下,要想让这个容器充满整个屏幕:`.container{min-height:100vh;display:flex}`2-让容器高度充满剩余屏幕高度要让容器充满屏幕的剩余高度,用vh结合flex布局就可以实现。`.conte
魔方编程
·
2020-06-29 17:19
web前端入门
到实战:页面平滑滚动小技巧
背景今天写需求的时候发现一个小的优化点:用户选择了一些数据之后,对应列表中的数据需要高亮,有时候列表很长,为了提升用户体验,需要加个滚动,自动滚动到目标位置。简单的处理了一下,问题顺利解决,就把这个小技巧分享一下给大家。正文有几种不同的方式来解决这个小问题。1.scrollTop第一想到的还是scrollTop,获取元素的位置,然后直接设置://设置滚动的距离element.scrollTop=v
魔方编程
·
2020-06-29 17:19
web前端入门
到实战:鼠标滑过横向时间轴效果
鼠标滑过横向时间轴效果—效果图:鼠标滑过横向时间轴效果—全部代码:19931993内容介绍19991999内容介绍20062006内容介绍20192019内容介绍$(function(){$("ulli").hover(function(){$(this).find('.time').slideDown(500);},function(){$(this).find('.time').slideUp
魔方编程
·
2020-06-29 17:19
web前端入门
到实战:HTML DOM 事件(实现一个简单的回到顶部功能)
HTMLDOM事件允许Javascript在HTML文档元素中注册不同事件处理程序。事件通常与函数结合使用,函数不会在事件发生前被执行!(如用户点击按钮)。利用onscroll事件写一个回到顶部功能,代码如下:Document*{margin:0;padding:0;}#mybtn{position:fixed;height:40px;width:100px;background:red;bord
魔方编程
·
2020-06-29 17:49
web前端入门
到实战:纯HTML做出几个实用网页效果
在我们以往看到的页面效果中,很多效果是需要JS搭配使用的,而今天在本文中,我将介绍如何使用纯HTML打造属于自己的实用效果。**1.**折叠手风琴使用Details和Summary标签可以创建没有JavaScript代码的可折叠手风琴。效果:HTMLLanguagesUsedThispagewaswritteninHTMLandCSS.TheCSSwascompiledfromSASS.Regar
魔方编程
·
2020-06-29 17:49
web前端入门
到实战:总结清除浮动的方法
方法一、在结尾处添加空div标签clear:both在浮动的盒子之下再放一个标签,在这个标签中使用clear:both,来清除浮动对页面的影响.注意:一般情况下不会使用这一种方式来清除浮动。因为这种清除浮动的方式会增加页面的标签,造成结构的混乱.123web前端开发学习Q-q-u-n:767273102,分享学习的方法和需要注意的小细节,不停更新最新的教程和学习方法(详细的前端项目实战教学视频)方
魔方编程
·
2020-06-29 17:49
web前端入门
到实战:制作仿京东商城-商品列表商品筛选功能
这次实现一个仿京东商城-商品列表商品筛选的功能一、html代码已选条件:×惠普-->品牌:全部惠普(hp)联想(Lenovo)联想(ThinkPad)宏基(acer)华硕戴尔三星索尼东芝Gateway微星海尔清华同方富士通苹果(Apple)神舟方正优雅价格:全部1000-29993000-34993500-39994000-44994500-49995000-59996000-69997000-9
魔方编程
·
2020-06-29 17:49
web前端入门
到实战:CSS设置滚动条样式
webkit滚动条样式重置1、scrollbar包含scrollbarbuttons和一个track。track进一步细分为trackpieces和thumb。tracepieces为thumb的上半部分和半下部分。2、scrollbarcorner为横向和竖向的交叉角区域3、resize用来设置滚动条的交汇处上用于拖动调整元素大小的小控件组成结构图如下:一旦发现滚动条的自定义样式,浏览器的默认样
魔方编程
·
2020-06-29 17:49
web前端入门
到实战:HTML定位和布局----float浮动
1、定位体系一共有三种(1)常规流;(2)浮动定位(3)绝对定位2、float属性常用的语法:(1)float:left;左浮动(2)float:right;右浮动(3)float:none;无浮动任何元素都可以使用浮动,无论是块级元素div、ul等等,还是行内元素都可以浮动,任何被声明float的元素都会自动被设置成块元素,有了块级元素的各种特点,可以设置宽高,可以设置内外边距。但是很重要的一个
魔方编程
·
2020-06-29 17:49
web前端入门
到实战:CSS3制作文字背景图
文字带上渐变色,或者说让文字透出图片。这些效果CSS属性也可以完成。方法一、利用CSS3属性mix-blend-mode:lighten;实现使用mix-blend-mode能够轻易实现,我们只需要构造出黑色文字,白色底色的文字div,叠加上图片,再运用mix-blend-mode即可,简单原理如下:核心代码如下:IMAGE.pic{position:relative;width:100%;hei
魔方编程
·
2020-06-29 17:48
web前端入门
到实战:使用CSS实现图片帧动画与曲线运动
在前端开发中,提到动画,我们可以:直接利用DOM实现动画。利用canvas实现动画。利用svg实现动画。直接用一张gif动图。利用图片实现帧动画。…所有动画的基本原理都是:在短时间内连续依次展示对应的图片,这样在视觉上看起来就是’动’的了。本文主要来说一说第4点和第5点。图片帧动画当我们要实现的动画效果比较复杂,而且开发排期比较紧的情况下,用一张gif动图来实现动画是成本最低,效果也不错的一种方案
魔方编程
·
2020-06-29 17:48
web前端入门
到实战:布局之display属性
在CSS中插何一个元素都是一个盒子,甚至是文本节点也是一个盒子(匿名盒子);都有自己的视觉格式化(不同的盒子)。而其中CSS的display属性又可以显式的修改每个盒子的视觉格式化模型,比如说从行内级盒子变成块级盒子。那在这一章节中,我们就来一起探讨CSS的display属性,该属性也是学习CSS不可或缺的属性之一。display的基本介绍CSS的display属性在W3C规范中是一个独立的模块,
魔方编程
·
2020-06-29 17:48
web前端入门
到实战:css中颜色
颜色如果我们相给页面设置颜色可以采用多种方法进行设置:一、命名颜色假设在设置页面的颜色时觉得一部分很小的颜色集中就足够了,就可以直接给定颜色的名称。CSS称这些有名称的颜色为命名颜色。命名颜色的关键字有限,css定义了17个标准色:浅绿色,黑色,蓝色,紫红色,灰色,橙色,绿色,石灰,栗色,海军,橄榄,紫,红,银,蓝绿色,白色和黄色。有的时候也许使用其他颜色值,并不在标准颜色之内的颜色也可以使用,它
魔方编程
·
2020-06-29 17:48
web前端入门
到实战:CSS新属性实现特殊的图片显示效果
1概述1.1前言使用一个或多个图像相关的CSS属性(background-blend-mode,mix-blend-mode,orfilter)可以实现许多特殊的图片显示效果,共列举了20种图片显示效果。2效果列表2.1铅笔画效果效果示例SCSS代码.pencil-effect{$url:url(photo.jpg);background-image:$url;background-size:co
魔方编程
·
2020-06-29 17:48
web前端入门
到实战:CSS属性width和height
width是定义元素内容区的宽度;height是定义元素在内容区的高度.在内容区外面可以增加内边距(padding)、边框(border)和外边距(margin),这样的话就成了我们常说的盒子模型,后期内容中会给大家讲到这些,在行内非替换元素会忽略width这个属性,也就是我们不定义这个元素的时候,默认值为auto,由内容将其撑开。绝对单位1.像素px(pixels),在web上,像素px是典型的
魔方编程
·
2020-06-29 17:48
web前端入门
到实战:HTML外边距合并现象、盒子模型以及宽度和高度
一、在默认布局的垂直方向上,默认情况下外边距是是不会叠加的,会出现合并现象,谁的外边距较大,就听谁的;但是在水平方向就不会出现这种状况,我们举个例子span{display:inline-block;width:100px;height:100px;border:1pxsolidred;}div{width:100px;height:100px;border:1pxsolidgreen;}/*我们
魔方编程
·
2020-06-29 17:48
web前端入门
到实战:css伪元素::after和::before,及图标字体的使用
css中的::after和::before已经被大量地使用在我们日常开发中了,使用他们可以使我们的文档结构更加简洁。但是很多人对::after和::before仍不是特别了解,究竟他们是做什么的?如何使用他们?什么时候应该使用他们?笔者总结了一些对伪元素的理解和使用经验。一、概念:1.定义TheCSS::before(::after)pseudo-elementmatchesavirtualfir
魔方编程
·
2020-06-29 17:48
web前端入门
到实战:HTML5 VideoAPI,打造自己的Web视频播放器
本文将使用HTML5提供的VideoAPI做一个自定义的视频播放器,需要用到HTML5提供的video标签、以及HTML5提供的对JavascriptAPI的扩展。一、基础知识1.用法注意:audio和video元素必须同时包含开始和结束标签,不能使用2.重要HTML属性controls:ontrol:如果出现该属性,则向用户显示控件,比如播放按钮。每个浏览器中的播放控件都不太一样,但用途都一样,
魔方编程
·
2020-06-29 17:48
web前端入门
到实战:Html介绍,CSS介绍,JavaScript介绍
标题图CSS介绍学前端必备掌握CSS样式,css为层叠样式表,用来定义页面的显示效果,加强用户的体验乐趣,那么如何用css到html中呢?style属性方式利用标签中的style属性来改变显示样式p标签作者:在head中加入style标签作者:p{color:#FFF000;}链接方式总结CSS选择器名称{属性名:属性值;…….}属性与属性之间用分号隔开属性与属性值用冒号连接选择器1.class选
魔方编程
·
2020-06-29 17:18
web前端入门
到实战:CSS背景background
1、背景颜色background-color取值:合法的颜色值和transparent注:背景颜色和背景图片,填充都是从边框开始2、背景图片background-image:url(图片路径)3、背景图平铺background-repeat:取值:repeat:平铺no-repeat:不平铺repeat-x:水平方向平铺repeat-y:垂直方向平铺4、背景图定位background-posion
魔方编程
·
2020-06-29 17:17
css
前端
web前端
前端教程
前端开发
web前端入门
到实战:CSS3中的弹性盒子模型
介绍在css2当中,存在标准模式下的盒子模型和IE下的怪异盒子模型。这两种方案表示的是一种盒子模型的渲染模式。而在css3当中,新增加了弹性盒子模型,弹性盒子模型是一种新增加的强大的、灵活的布局方案。弹性盒子模型是css3中新提出的一种布局方案。是一种为了应对针对不同屏幕宽度不同设备的一整套新的布局方案。主要是对一个容器中的子元素进行排列、对齐和分配空白空间的方案的调整。新旧版本的弹性盒子模型在之
魔方编程
·
2020-06-29 17:17
web前端入门
到实战:CSS定位
一、什么是定位改变元素在页面中的位置二、定位的分类1、普通流定位2、浮动定位3、相对定位4、绝对定位5、固定定位三、普通流定位页面中元素的默认定位方式,默认文档流,从上往下,从左往右1、每个元素都在页面有自己的空间2、每个元素都是从父元素的左上角开始显示3、块级元素都是按照从上到下的方式逐行排列,每个元素独占一行4、行内元素是多个元素在一行显示,从左往右逐个排列对web前端这门技术感兴趣的小伙伴可
魔方编程
·
2020-06-29 17:17
web前端入门
到实战:css 定位布局
文档流:文档流,是指盒子按照html标签编写的顺序依次从上到下,从左到右排列。块元素占一行,行内元素在一行之内从左到在排列,先写的先排列,后写的排在后面,每个盒子都占据自己的位置。关于定位:可以使用css的position属性来设置元素的定位类型,position设置项如下:(1)relative生成相对定位元素,元素所占据的文档流的位置保留,元素本身相对自身原位置进行偏移。(2)absolute
魔方编程
·
2020-06-29 17:17
web前端入门
到实战:几种HTML标签伪元素绑定事件的方式
下面整理出几种简便方式实现click伪元素时进行事件处理,附上例子代码。HTML结构首先HTML结构是这样的按钮文字实现方法第一种通过CSS3的pointer-events特性来实现。CSS代码*{margin:0;padding:0;}section{border:1pxsolid#abc;border-radius:5px;background-color:#def;font-family:M
魔方编程
·
2020-06-29 17:17
前端
html
html标签
web前端
前端教程
web前端入门
到实战:CSS盒子模型
一、什么叫框模型页面元素皆为框(盒子),定义了元素框处理元素内容,内边距,外边距以及边框的计算方式。二、外边距围绕在元素边框外的空白距离(元素与元素之间的距离)语法:margin,定义4个方向的外边距1、单边定义:margin-top/right/bottom/left(1)取值:以px为单位,%占父级元素宽度的%比正数:margin-left元素向右移动,margin-top元素向下移动负数:就
魔方编程
·
2020-06-29 17:17
web前端入门
到实战:JS生成由字母与数字组合的随机字符串
在项目中可能需要随机生成字母数字组成的字符,如生成3-32位长度的字母数字组合的随机字符串(位数不固定)或者生成43位随机字符串(位数固定)使用Math.random()与toString()方法的结合先看一下这个方式:Math.random().toString(36);结果:0.9kfiead48ntoString后的参数规定可以是2-36之间的任意整数,不写的话默认是10(也就是十进制),此
魔方编程
·
2020-06-29 17:17
web前端入门
到实战:CSS flex布局入门
一、whyflex都知道html正常的文档流是自上而下排列的,块级元素会像下左图一样排列。但是项目中尤其是移动端项目会有很多需求的排版方式是要求由左到右排列。虽然可以通过dispaly:inline-block、float、position完成排版,但是需要对距离进行计算,计算起来十分麻烦。2009年W3C提出了一种新的方案–引入了弹性布局flex方式,通过容器的轴线来排列项目,简直是移动端开发的
魔方编程
·
2020-06-29 17:17
web前端入门
到实战:CSS图形绘制合集
以下这些造型简单的图形都是纯CSS外加一个HTML标签实现的,不少实现以前我介绍过,或者你也知道,但是有些相信你没见过。1.正方形实时渲染效果如下:相关CSS代码:#square{width:100px;height:100px;background:red;}2.长方形效果:相关CSS代码:web前端开发学习Q-q-u-n:767273102,分享学习的方法和需要注意的小细节,不停更新最新的教程
魔方编程
·
2020-06-29 17:46
web前端入门
到实战:css左边竖条的实现方法
问题描述:在只使用一个标签的情况下实现左边竖线,通用标签与样式如下:实现左边竖线html:实现左边竖线css:web前端开发学习Q-q-u-n:767273102,分享学习的方法和需要注意的小细节,不停更新最新的教程和学习方法(详细的前端项目实战教学视频).div1{width:200px;height:50px;line-height:50px;text-align:center;backgro
魔方编程
·
2020-06-29 17:46
web前端入门
到实战:CSS动画Transition与Animation
本文总结CSS3中两个用来做动画的属性,一个是transition,另一个是animation。差异比较CSS3差异transition在给定的持续时间内平滑地更改属性值(从一个值到另一个值),也就是只需要指定开始与结束的参数,参数改变时就触发动画。常用语鼠标事件(:hover、active、:focus、:click)或键盘输入时触发需要事件触发,无法在网页加载时自动发生。一次性,不能重复发生,
魔方编程
·
2020-06-29 17:46
web前端入门
到实战:Css背景定位
同一个标签可以同时设置背景颜色和背景图片,如果颜色和图片同时存在,那么图片会覆盖颜色。1.在CSS中有一个叫做background-position:属性,就是专门用来控制背景图片的位置2.格式:background-position:值1值2;值1的取值范围:leftcenterright值1代表背景图片的水平位置值2的取值范围:topcenterbottom值2代表背景图片的垂直位置值1和值2
魔方编程
·
2020-06-29 17:46
web前端入门
到实战:CSS实现页面翻转 正反两面展示不同的内容
要点:1页面旋转使用css3的rorateY(180deg)实现页面的翻转2使用backface-visibility实现正面元素翻转之后背面不可见,显示出反面的元素demo:html反面的内容正面的内容cssweb前端开发学习Q-q-u-n:767273102,分享学习的方法和需要注意的小细节,不停更新最新的教程和学习方法(详细的前端项目实战教学视频)div{width:200px;height
魔方编程
·
2020-06-29 17:46
web前端入门
到实战:12个HTML和CSS必须知道的重点难点问题
这12个问题,基本上就是HTML和CSS基础中的重点难点了,也是必须要弄清楚的基本问题,其中定位的绝对定位和相对定位到底相对什么定位?这个还是容易被忽视的,浮动也是一个大坑,有很多细节。这12个知识点是我个人认为的,下面我们就来看看这12个知识点。1.怎么让一个不定宽高的DIV,垂直水平居中?使用Flex只需要在父盒子设置:display:flex;justify-content:center;a
魔方编程
·
2020-06-29 17:46
Web前端就业前景怎样 在学web前端如何求职就业
Web前端入门
简单、应用广泛,是很多转行从事IT开发的人们的首选。越来越多的人涌入Web前端行业加剧了市场竞争,而互联网技术的更新升级也让企业对于求职者有了更高的要求,出现“低端饱和、高端紧缺”现状。
weixin_45810671
·
2020-06-29 16:36
css
html
web
前端
前端就业
web前端入门
到实战:实现点击按钮后CSS加载效果
效果演示先来看一下完成的效果。实现过程这个效果其实很容易,先来看一下原本的按钮长相,就只是个div套用CSS而已。HTML:clickmeCSS:.btn{position:relative;width:200px;height:30px;line-height:30px;text-align:center;border-radius:3px;background:#5ad;color:#fff;
编程世界-云
·
2020-06-29 16:11
web前端入门
到实战:CSS 3D动画(魔方效果,多重立体图,圆柱效果,齿轮效果)
本篇文章给大家带来的内容是关于css实现3d动画特效的代码实例,有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助。属性perspective:透距离,单位像素(值越小,透视距离越近,效果越明显):设置父元素上perspective-origin:设置透视点的位置transform-style:指定某元素的子元素是位于三维空间内,取值:flat|preserve-3d一、写一个简单的立方
编程世界-云
·
2020-06-29 16:11
web前端入门
到实战:css基础-float浮动
float实现文字环绕图片效果:floatbody{font-family:'微软雅黑';}.per{width:400px;border:1pxsolid#CCC;padding:5px;}.red{width:100px;height:100px;background:red;margin:10px;float:left;}层叠样式表(英文全称:CascadingStyleSheets)是一种
编程世界-云
·
2020-06-29 16:11
上一页
1
2
3
4
5
6
7
8
下一页
按字母分类:
A
B
C
D
E
F
G
H
I
J
K
L
M
N
O
P
Q
R
S
T
U
V
W
X
Y
Z
其他