前端笔记新手站长网页设计和网站建设干货分享

使用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实现方法 ...