一半设计一半前端

每一个网站都应该有一个搜索表单，因为当网站内容太多的时候，依靠导航去翻找内容太困难了，所以翻页太累，不如直接搜索。现在的搜索表单的样式都几乎是扁平化设计，用图片的很少了。查看案例  案例下载完成普通的表单设计的难点在于如何控制输入框和按钮的高度对齐，以及去掉两个控件之间的间隔。因为inpu...

文章列表在网站上占据很大的面积，如何制作出美观的文章列表，以及如何在文章列表前面添加各种小图标，或者有数字的排行榜呢？要掌握这篇文章的内容，需要有背景定位的基础知识哦，如果还不会的童鞋，建议先学习第九课的内容。CSS第九课：利用background-position完成css sprite效果查看案...

刚才写了一大篇，结果网络出问题，没有保存上，气的吐血。最近DNS总是解析出问题，阿里云总说很好，没问题，害的我现在一点心情都没有了。重新写一篇文章的感受就是味同嚼蜡，好吧，不要把坏情绪扩散开来，影响到读这篇文章的童鞋们。进入正题吧。背景是网页非常重要的一个元素，背景颜色和背景图片的应用为网站增色不少...

一个网站，主导航的重要性不言而喻，美观、实用、交互、结构清晰都是要点。前面我们已经学习了超链接a的基本样式，普通超链接的样式主要是鼠标经过的时候改变文字颜色和下划线。而主导航的样式一般改变的是背景颜色或者背景图片。这两年流行扁平化设计，几乎都是纯色为主了。今天我们利用display:block这个关...

图片是网页元素中非常重要的内容，精美大气，排版合理的美图会为网站加分不少。图片一般有哪些常规的样式可以设置呢？首先明白图片是inline-block（内联块状）对象，就是图片可以并排在一起，可以内联，但是图片本身有宽高，又是一个块状对象。查看案例 下载案例一、为图片设置边框和去掉边框一张图...

今天早上，康晓玲同学拿着一个U盘在我面前晃了一晃，问道，老师，这是你的吗？我看着那个熟悉的U盘，不正是我朝思暮想，迷失了一天的U盘吗？失而复得的惊喜实在太大了，让我旋转、跳跃、闭上眼……在此，感谢康晓玲同学，你拯救了我32G的教学资料，我的命，咳咳……，又跑题了！回到正题，大家认为讲完了margin...

今天32G的U盘掉了，其实优盘无所谓，关键是里面满满的教学资料，好多新内容还没有备份到电脑上，好心塞！一点幽默的开头语都想不出来了，直接进入正题吧。一、认识谷歌浏览器“审查元素”中的盒模型。查看一个元素，只需要看这个图，你就应该知道该对象有这几个属性值：1、宽高（336px*114px）2、padd...

一、width（宽度）和height（高度）不是所有的html元素都可以设置宽高的。像div一样的块状对象可以设置宽高，但是像a、span一样的内联对象就不可以设置宽高，除非先转换成块状对象。如果对块状，内联对象不清楚的童鞋，可以先看这篇文章：CSS教程：display常用的四个值（block,in...

CSS的全名叫“层叠样式表”，“层叠”是非常关键的一个词，代表了不同来源的样式在最终的效果上呈现继承、叠加、冲突覆盖等。一、CSS的五种来源1、浏览器默认样式2、浏览器用户自定义样式3、<link>外部样式表4、<style>内部样式表5、<标签  style...

CSS如何应用到网页中呢？大致有三种方法：1、行间样式表2、内部样式表3、外部样式表一、行间样式表<h1 style="text-align:center;color:#f90;">文章标题</h1>很明显，这种写法，style样式和html结构...