使用CSS给网页布局,一般常用的方式是通过设置浮动或定位,而弹性布局是一种更灵活的方式,英文Flexible意思是“灵活的”,英文Flex具有收缩的意思 ...
本文分享的这款焦点图幻灯片代码是最常用的图片轮播方式,没有过多花哨的效果,使用很方便,只需准备几张banner图片即可,建议使用尺寸1024*360的图片,下面是html部分,语义 ...
文本输入控件(input)可以让用户在输入框中输入相应的字段,其type属性决定了输入字段的类型,除了传统的输入文字外,在html5中还增加了很多特殊的类型,比如可调取调色器选 ...
固定在左侧的导航栏,点击一级菜单可展开子菜单的效果,经常在一些建站系统的后台可以看到,例如织梦CMS后台:文本主要分享一个简单的左侧固定导航的做法,这里是借助jQuer ...
两列或多列布局的方法有很多,目前来说,浮动的方式用的比较多,例如下面这个就是典型的两列布局,父容器宽度为600px,左右两列分别为400px和200px,未设置具体的高度 ...
在HTML5中可以对文本输入框增加placeholder属性,英文placeholder意思是占位符,用在文本输入框的时候可以友好的显示提示文字,例如下面这个就是常见的文本框提示效果 ...
曾在《CSS制作上下左右箭头》这篇文章里分享了通过三角形和小矩形拼接实现简单小箭头的方法,制作的箭头图案大致是这样:生活中常见的箭头形状还有很多种,比如下图所 ...
网页中加入封页套或折页的效果会更个性更有立体感,一般这种效果是通过一个小图片定位的方法实现的,本文主要分享用纯CSS的方法实现这样的效果:这里的封页套效果相当 ...
在较长的网页上加一个快速返回顶部的按钮是较好的用户体验,但如果点击按钮直接回到顶部则有些生硬了,所以多数网站都采用平滑滚动到顶部的方式,该效果实现的方法有很 ...
常见的雪花图案大致轮廓是一个星号的形状,实现星号的方法一般是在一个长条矩形上分别叠加旋转60度和-60度的两个长条矩形,如下图:本文所分享的CSS制作的雪花图案最终 ...
网店里经常会用到一些优惠秒杀或打折信息的图标,例如下图就是几个常见的图标样式:第一个图标目测是由三个圆角矩形叠加形成的,所以实现的方法很简单,使用2D旋转就可以 ...
CSS阴影属性可以轻松的将一个元素复制一份,本文主要分享简单的利用CSS阴影属性这个特点实现一个太阳的图案,太阳图案一般可由中间的圆形和四周的“光线”组成,下面先 ...
以往在网页中引入视频的代码很复杂,在html5中出现了专用于视频的video标签,在网页中引用视频变得就像引用图片那样容易了,最简单的视频引入代码为:<video src="v1.mp4 ...
制作图片类网站的时候,如果能点击图片后翻页,则是一种很好的用户体验,本文主要分享dedecms如果设置点击图片翻页,实现该功能需要修改程序文件,这里以dedecms5.7-UTF8版 ...
通过CSS中的2D变换和定位的配合,可以实现一些简单的会话气泡图案,这样避免图片的使用,可以减少服务器的资源请求,本文以微信图标为例,简单的说说回话气泡的CSS实现方法 ...