最近更新

CSS第三课:选择器的继承、叠加、冲突优先级详解

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

你只努力一次还是每次都努力?

每天上完课后我都会布置上机作业,然后在第二天上课的时候当众点评,因为都是投影教室,这样学生也可以参考别人的作业,从别人的优点和缺点中去学习。利用下课时间,我会在作业检查表上给交了作业的同学后面打上勾。遗憾的是,我不是每次都能及时记录,一个星期大概有两三次。几个星期下来,作业检查表上呈现出了几种情况:...

CSS第二课:如何应用CSS到网页中?

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

CSS3教程:利用border的transparent特性完成面包屑导航

border属性在CSS3新增了很多样式,比如border-radius圆角样式,其中可以为border-color设置transparent值则实现了利用该样式绘制三角形等的能力。transparent表示透明,透明不代表不存在。在CSS2里面,只能为background-color设置该值,在C...

CSS第一课:CSS简介及选择器介绍

CSS,全名为“层叠样式表”,Cascading Style Sheets,样式表比较好理解,就是为网页添加了样式,而层叠比较难理解,它的核心是“继承”与“冲突”。CSS的目的:重定义HTML的默认样式。也许你觉得HTML标签的默认样式很丑,但是却没有在意过这些标签为什么丑,它有什么默认的样式?我如...

HTML第八课:表单

表单的目的是获取用户的信息,然后处理信息并返回给用户结果,比如百度搜索,登录表单,或者保存用户的信息到数据库中,比如注册表单,发表日志,评论别人的文章等。一、表单的结构1、必须有表单的标签<form></form>,把所有可以输入信息的控件包含在表单的标签里面。2、要有用户能...

CSS3教程:box-shadow完成盒阴影效果

与text-shadow的原理一样,只不过text-shadow是为文字做阴影,而box-shadow是为盒对象做阴影。这里的盒包括块状(block)、内联(inline)、内联块状对象(inline-block)。如果对盒对象不清楚的童鞋,可以先看这篇文章:˂a href="http://mrsz...

CSS教程:display常用的四个值(block,inline,none,inline-block)

网页的元素总体可以概括为两大类:1、块状对象(block)2、内联对象(inline)一、什么是块状(block)对象?无论宽度多少,都独占一个通栏的,不能和别的对象并排在一起的就是。比如h1~h6,div,ul,li,p等元素。可以通过浮动(float)实现块状元素的并排,但是会产生高度不自适应和...

CSS3教程:text-shadow制作文字阴影效果

在css2时代,如果文字制作了特殊的样式,比如图层样式之阴影发光等效果,必须把该文字保存为图片才能展示在网站上。而css3新增的text-shadow属性,可以轻松实现文字投影、发光、内阴影等很棒的立体效果,具体效果如图:˂...

HTML第七课:图像

图像传达信息的能力与文字一样,甚至更具感染力,所以网页中一定少不了图片的应用。图像主要有三种用法:1、普通图片,用<img/>标签显示在网页中的素材。2、背景图片,用来美化网页或者显示特殊字体效果。3、图片地图热区,实现一张图片有多个超链接。一、普通图片<img/><i...

HTML第六课:列表

列表是组织网页内容非常有用的一种方法。列表主要分为:1、无序列表2、有序列表3、定义列表一、无序列表用在网站的导航(网站主导航,侧边栏导航,文章列表)上,用来组织内容,是一种结构性标签。在li里面可以包含div等布局性的标签。1、基本结构<ul>    &...

HTML第五课:超链接和锚点

了解了URL路径的概念后,超级链接就很容易掌握了。一、超链接超级链接的目的就是实现页面和页面,站点和站点之间的跳转,没有超链接就没有互联网,所以认真学习和工作的时候不要随便点开一个新闻的推送链接,否则你就可能引发多诺米牌效应,最后迷失在互联网里。1、基...

CSS小技巧汇总(不断更新)

这篇文章主要记录学习CSS过程中遇到的很好的小技巧,不断更新……1、平时设置字体的时候总喜欢分开写,比如这样:font-family: Arial, Helvetica;  font-weight: bold;  font-style: ...

利用FontAwesome字体实现小图标的插入

网站上面不是所有的图片都是图片,有些小图标可能是一种特殊字体呈现的,比如这种纵向导航前面的小图标。具体的使用方法如下:1、先下载FontAwesome字体和对应的CSS文件,放在自己的站点css文件夹中。2、...

HTML第四课:物理路径、绝对路径、相对路径

学习超级链接之前,先认识URL(统一资源定位器),如果不考虑百度百科这样专业的解释,我们大致可以把路径分为“物理路径”、“绝对路径”、“相对路径”。一、物理路径,以盘符开头的本地路径,比如:f:\文件夹\1.jpg<ul>     <li&...

HTML第三课:认识标题、段落、区块、强调等文本标签

一个网页中文字是传达信息的主要元素,文本主要由重要的标题、文章段落、被强调的文本、普通的文本组成。一、标题标题标签有六个,依次是h1,h2,h3,h4,h5,h6。<h1>网页最重要的文字标签,一般用在logo、三级页面文章标题上。</h1> <h2>重要性次于...

HTML第二课:认识HTML4和HTML5的文档结构

这两节课的目标是认识HTML4和HTML5的文档结构,了解它们的区别。一、HTML4文档结构<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"...

HTML第一课:认识HTML语言并在DW中建立站点

这两节课的目标是认识HTML是什么以及学会在DW中建立站点,并发布自己的第一个html页面。一、认识HTMLHTML概念:超本文标记语言(HyperText Markup Language)超文本:浏览器就可以解释的,比如http(超文本传输协议)。官方解释:“超文本”就是指页面内可以包含图片、链接...
Top