文章分类 - CSS
摘要:2.空间定位 在这一节里,我们来看一个利用z-index定位的例子,这个例子的效果在这里。 我们看到例子中的两幅图片和一段文字分别处于不同的空间位置,文字覆盖在那朵花的图片上,而挥动小旗的小老鼠却又覆盖在文字的上面。那么这种效果是怎样实现的呢?这里利用了CSS定位的z-index属性,代码如下: zindex //*导入一...
阅读全文
摘要:1.动态转换 通过在CSS中设置属性,我们可以准确的定义一个页面的样式,如颜色、字体、边框等。现在我们要讲的CSS定位主要是在页面的布局和控制上进行定义,使您的页面从这两个方面都展现的非常完美,更加富有动感。 另外,在讲解之前,我们首先介绍两个定义:相对定位和绝对定位。相对定位就是允许在文档的原始位置上进行偏移。而绝对定位则允许任意定位。 实现CSS的定位最终还是要靠属性。我们来看一下定...
阅读全文
摘要:6、鼠标属性 我们知道,当把鼠标移动到不同的地方时,当鼠标需要执行不同的功能时,当系统处于不同的状态时,都会使鼠标的形状发生改变。 用CSS来改变鼠标的属性,就是当鼠标移动到不同的元素对象上面时,让鼠标以不同的形状、图案显示。 在CSS当中,这种样式是通过“cursor”属性来实现的。Cursor属性有很多的属性值,我们来看一下它的详细列表: 我们来看一个例子吧,请看下面这段代码:...
阅读全文
摘要:5、分级属性 如果您使用过Word,那您一定知道Word中有一个“项目符号和编号”的功能。 在html中,您无需使用前面提到的一些字体、颜色、容器属性来对字体、颜色和边距、填充距等进行初始化。因为在CSS中,已经提供了进行分级的专用分级属性。 分级属性包括了“list-style”(列表样式)、“list-item”(列表项)等多种属性,我们先来看一下分级属性的详细列表: 下面我们...
阅读全文
摘要:※图文混排 我们在来看看“容器”属性还有什么其他的属性,请看属性列表: 上表中的float属性很有意思,我们看看用它作的一个页面效果(如下图): 您是不是以为在图片那里插入了一个表格才实现这种图文混排的效果的呢? 其实不是的,在这里只是在中定义了一下的float和margin属性,代码如下: margin css ...
阅读全文
摘要:※边框属性 本节我们来看一下种类繁多的边框属性,先来看一下属性列表: 是不是看上去很多,其实应用起来很方便。 只要灵活的运用一次定义的属性就会方便很多。其实还有一个一次设置所有边框的宽度、样式和颜色属性的border属性,但是border只能使四条边框的属性值是一样的。我们现在来给前面的例子设置一个5像素宽、双边框并且是紫色的边框(如下图): 这就是在中定义的属性,代码如下:...
阅读全文
摘要:※填充距属性 本节我将向您介绍填充距属性。我们先来看一下填充距的属性列表: 首先我们得先了解什么叫填充距,它与边距有什么差别呢?填充距指的是文本边框与文本之间的距离。 这样讲是不是有些难懂,由于填充距属性与margin一样,都有一个一次定义的属性:padding,所以我们举个例子,看一下到底什么叫填充距,请看下图: 我们看到上图中红框圈住的地方就是填充距起作用的部分。实际上上图的...
阅读全文
摘要:4、“容器”属性 ※边距属性 听起来是不是很有趣,什么叫“容器”属性呢?CSS的容器属性包括边距、填充距、边框和宽度、高度、浮动、清除等属性。 您想,网页中的内容肯定是都需要“装”进这个“容器”里。“容器”属性是CSS中非常重要的一种属性,我们将分类进行学习。 先来看一下边距属性的详细列表: 和font属性一样,表中的四个属性可以用一个属性一次。边距顺序是上、右、下、左。我们...
阅读全文
摘要:※装饰超链接 网页默认的链接方式是这样的:未访问过的链接是蓝色文字并带蓝色的下划线,访问过的超级链接是深紫色的文字并带深紫色的下划线。如果您所有的网页都是这种样式,是不是很单调呢? 其实,利用文本属性中的Text-decoration属性就可以实现对超链接的修饰。我们先看下面的这段代码: link css 未访问的链接 //*...
阅读全文
摘要:2、颜色和背景属性 您总不希望自己的页面处于黑白世界吧。如果给用属性定义的文本添上颜色是不是会更好呢? 下面我们就讲一下CSS的颜色和背景属性。先来看一下CSS下的颜色和背景都有哪些属性吧(如下表): 我们还是举个例子吧。比如上一节讲到的“LEAF”字体,我们在其中加入颜色属性,在再加入以下代码: color:rgb(204,82,28); background-img:ur...
阅读全文
摘要:3、文本属性 ※定义间距 前面说了如何用CSS定义字体、颜色和背景属性,那么定义好的文本我们怎么对它进行排版呢? 下面我们讲述一下CSS的文本属性,还是先来看一下文本属性的详细列表: 我们可以从表中看到在这里可以定义文本的文字间距、字母间距、装饰、对齐方式、缩进方式和行高等属性。 举个例子来看看吧。比如下面这段文字(如左下图): 我们对这段文字加上文本属性重新排版,排版...
阅读全文
摘要:1、 字体属性 这是最基本的属性,您经常都会用到。它主要包括以下这些属性: 光看表格是不是有些难懂,不要紧,我们来看一个用表格中的属性定义的字体样式(如下图): 第一行只是采用了“font-family”属性,代码是这样的: hongen 这行代码定义了“hongen”将以“lucida console”的字体显示; 第二行font-family为默认值,而是定...
阅读全文

浙公网安备 33010602011771号