使用CSS—轻松学习网站界面制作(一)

最新推荐文章于 2022-12-03 12:31:08 发布

VIP文章陈宗毅

最新推荐文章于 2022-12-03 12:31:08 发布

阅读量4.4k

点赞数 16

分类专栏： CSS 深入浅出讲解CSS+DIV 文章标签： css menu class stylesheet html xhtml

本文链接：https://blog.csdn.net/yi_zz/article/details/7686301

版权

这些天为了做一个网站，所以顺便学习了一下CSS，不能算是很专业的学习CSS，主要是为了更好的完善这些个界面而学习，写这篇博客是为了让大家和我一起来学习做网站，体会做网站的乐趣，达到轻松学习的目的。

CSS特点：实现一个网页内容与样式的分离。这是CSS非常有优势的一个特点，省去了我们很多的麻烦。我们来做一个简单的例子来看一下这个效果：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<!--
    创建人：陈宗毅
-->
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>CSS测试</title>
</head>
<body>
    <font color=“#0000ff”>栏目一</font>
    <font color=“#0000ff”>栏目二</font>
    <font color=“#0000ff”>栏目三</font>
</body>
</html>

没有CSS之前，我们是这样要是把这个颜色改为别的颜色，那么只能一个个颜色值的改，这个工作量很恐怖的。

之后我们使用CSS来进行优化，我们先来使用CSS选择器：

类选择器：这就是我们在HTML中查找类所设置的一个值。

我们使用span标签+类标志，我们把body里边的内容改成这样：

<body>
    <span class="menu">栏目一</span>
    <span class="menu">栏目二</span>
    <span class="me

最低0.47元/天解锁文章

陈宗毅

关注

16
点赞
踩
7

收藏

觉得还不错? 一键收藏
15
评论
使用CSS—轻松学习网站界面制作(一)

这些天为了做一个网站，所以顺便学习了一下CSS，不能算是很专业的学习CSS，主要是为了更好的完善这些个界面而学习，写这篇博客是为了让大家和我一起来学习做网站，体会做网站的乐趣，达到轻松学习的目的。CSS特点：实现一个网页内容与样式的分离。这是CSS非常有优势的一个特点，省去了我们很多的麻烦。我们来做一个简单的例子来看一下这个效果：
复制链接

扫一扫