0 0 2 2 - CSS的'继承'

不二如是 · 发表于 2017-1-14 16:39:56

购买主题 已有 28 人购买 本主题需向作者支付 2 鱼币 才能浏览

shishunfu · 发表于 2017-4-21 09:37:17

交作业

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>CSS继承</title>
<style type="text/css">
html, body {
height: 100%;
font-family: sans-serif, serif, cursive, fantasy, monospace;
}
body {
background-color: #f5f5dc;
margin: 0;
padding: 0;
text-align: center;
color: #FF4488;
}
#first {
color: #FF0088;
}
#second {
color: #FF0066;
}
#third {
color: #FF0044;
}
#forth {
color: #ff0022;
}
#fifth {
color: #ff0000;
}
</style>
</head>
<body>
<header>
<h4>《热爱生命》</h4>
<p style="margin-left: 100px;">汪国真</p>
</header>
<div id="first">
<section>
<p>
我不去想,<br/>
是否能够成功;<br/>
既然选择了远方,<br/>
便只顾风雨兼程。<br/>
</p>
</section>
<div id="second">
<section>
<p>
我不去想, <br/>
能否赢得爱情;<br/>
既然钟情于玫瑰,<br/>
就勇敢地吐露真诚。</p>
</section>
<div id="third">
<section>
<p>
我不去想, <br/>
身后会不会袭来寒风冷雨;<br/>
既然目标是地平线,<br/>
留给世界的只能是背影。</p>
</section>
<div id="forth">
<section>
我不去想, <br/>
未来是平坦还是泥泞;<br/>
只要热爱生命,<br/>
</section>
<div id="fifth">
<section>
一切，都在意料之中
</section>
</div>
</div>
</div>
</div>
</div>
</body>
</html>

复制代码

781318059 · 发表于 2017-1-15 10:34:58

我来看看.....这是做网页用的吗？

不二如是 · 发表于 2017-1-15 10:38:50

781318059 发表于 2017-1-15 10:34
我来看看.....这是做网页用的吗？

是的，前端开发。

可以这么理解，就是做网页的～

781318059 · 发表于 2017-1-15 12:03:22

不二如是发表于 2017-1-15 10:38
是的，前端开发。

可以这么理解，就是做网页的～

涨知识了

joker11111 · 发表于 2017-2-22 15:35:52

本帖最后由 joker11111 于 2017-2-22 15:37 编辑

SonOmiga · 发表于 2017-3-4 16:28:50

get !

SonOmiga · 发表于 2017-3-4 16:36:28

想知道  body{
                     color: #FF0088;  这段不加加上 #first 什么的  为什么没有起到作用.
            }

会魔法的魔法 · 发表于 2017-3-17 16:45:26

吸血鬼 and 颜色好评

晓月56 · 发表于 2017-6-26 22:38:11

shishunfu 发表于 2017-4-21 09:37
交作业

font-size:30px;添加到body{}的选择器里

MSK · 发表于 2017-7-14 16:54:47

交！作！业！

<!DOCTYPE html>
<html>
<head>
<title>继承</title>
<style type='text/css'>
#first{
color: #FF88C2;
font-size:15px;
text-align:center;
font-family:宋体;
}
#second{
color: #FF0088;
font-size:16px;
}
#third{
color: #C10066;
font-size:17px;
}
</style>
</head>
<body>
<div id='first'>
<p>从明天起，做一个幸福的人</p>
<p>喂马，劈柴，周游世界</p>
<p>从明天起，关心粮食和蔬菜</p>
<p>我有一所房子，面朝大海，春暖花开</p>
<br />
<div id='second'>
<p>从明天起，和每一个亲人通信</p>
<p>告诉他们我的幸福</p>
<p>那幸福的闪电告诉我</p>
<p>我将告诉每一个人</p>
<br />
<div id='third'>
<p>给每一条河每一座山取一个温暖的名字</p>
<p>陌生人，我也为你祝福</p>
<p>愿你有一个灿烂的前程</p>
<p>愿你有情人终成眷属</p>
<p>愿你在尘世获得幸福</p>
<p>我只愿面朝大海，春暖花开</p>
</div>
</div>
</div>
</body>
</html>

复制代码

aswyamato1989 · 发表于 2017-7-14 23:56:42

交作业！
《Loveless》

rock5442107 · 发表于 2018-6-5 21:33:30

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>021-汪國真</title>
<style type="text/css">
body{
text-align:center;
}
#zero{
color:#FF00FF;
}
#first{
color:#FF88C2;
}
#second{
color:#FF44AA;
}
#third{
color:#FF0088;
}
#forth{
color:#C10066;
}
#fifth{
font-weight:bold;
color:#A20055;
}
</style>
</head>
<body>
<div id="zero">
<p>《熱情的詩》</p>
</div>
<div id="first">
<p>我不去想是否能够成功既然选择了远方便只顾风雨兼程</p>
<div id="second">
<p>我不去想能否赢得爱情既然钟情于玫瑰就勇敢地吐露真诚
</p>
<div id="third">
<p>我不去想身后会不会袭来寒风冷雨既然目标是地平线留给世界的只能是背影
</p>
<div id="forth">
<p>我不去想未来是平坦还是泥泞只要热爱生命
</p>
<div id="fifth"><p>一切，都在意料之中
</p>
</div>
</div>
</div>
</div>
</div>
</body>
</html>

复制代码

STmove · 发表于 2018-7-15 17:45:03

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>lesson 0022</title>
<style type="text/css">
body
{
color:#6ff;
}
#second /* '#'for id*/
{
color:#6dd;
}
#third
{
color:#5aa;
}
#forth
{
color:#270;
}
/*貌似用id规定格式的话比用class优先级高一点？*/
/* #fifth
{
color:#999;
} */
.test /* '.' for class */
{
color:#c0c;
}
</style>
</head>
<body>
<div id="first">
<p>我不去想是否能够成功既然选择了远方便只顾风雨兼程</p>
<div id="second">
<p>我不去想能否赢得爱情既然钟情于玫瑰就勇敢地吐露真诚
</p>
<div id="third">
<p>我不去想身后会不会袭来寒风冷雨既然目标是地平线留给世界的只能是背影
</p>
<div id="forth">
<p>我不去想未来是平坦还是泥泞只要热爱生命
</p>
<div id="fifth" class="test"><p>一切，都在意料之中
</p>
</div>
</div>
</div>
</div>
</div>
</body>
</html>

复制代码

话说今天好热了，出门5分钟流汗1小时，不过云挺好看的
微信图片_20180715170750.jpg

船到桥头自然沉 · 发表于 2018-9-5 23:06:34

soulwyb · 发表于 2018-10-16 23:54:23

<!doctype html>
<html>
<head>
<title>
汪国真
</title>
<style type="text/css">
body {
color: #ff0088;
}
#first {
color: #ff88c2;
}
#second {
color: #ff44aa;
}
#third {
color: #ff0088;
}
#forth {
color: #c10066;
}
#fifth {
color: #a20055;
}
</style>
</head>
<body>
<div id="first">
<p>我不去想是否成功既然选择了远方便只顾风雨兼程</p>
<div id="second">
<p>
我不去想是否能够赢得爱情既然钟情于玫瑰就勇敢地吐露真诚
</p>
<div id="third">
<p>
我不去想身后会不会袭来行风冷遇既然目标是地平线留给世界的只能是背影
</p>
<div id="forth">
<p>
我不去想未来是平坦还是泥泞只要热爱生命
</p>
<div id="fifth">
<p>
一切，都在意料之中
</p>
</div>
</div>
</div>
</div>
</div>
</body>
</html>

复制代码

QiaoaiMen · 发表于 2018-11-15 20:18:08

交作业啦。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>读首诗再睡觉181114</title>
<style type="text/css">
body{
text-align: center;
}
#first{
color: #FF88C2
}
#third{
color: #FF44AA
}
#forth{
color: #ff0088
}
#fifth{
color: #C10066
}
#sixth{
color: #A20055
}
</style>
</head>
<body>
<div id="first">
<h1>适得其所（节选）</h1>
<div id="second">
<p>愿月光为这块石头洗礼命名。<br>愿月光祝福大大小小的众多石头</p>
<div id="third">
<p>愿这隔着一座山仿佛在下雨的<br>遗忘的山谷，月光重新亲吻它。</p>
<div id="forth">
<p>愿那些高高在上的人，他们眼睛里的荒杂地<br>虽不是伊甸园却也是乐园。</p>
<div id="fifth">
<p>愿月光偏爱他们。愿我们都要在上面建立家园<br>的那两块岩石高耸，一百年后仍在它们原来所在。</p>
<div id="sixth">
<p>愿他们的恐惧消失</p>
</div>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
<img src="https://fishc.com.cn/forum.php?mod=image&aid=104820&size=300x300&key=8b6909ea3b5a2fcd&nocache=yes&type=fixnone" aid="attachimg_104820" alt="" border="0">

复制代码

542624047 · 发表于 2019-1-16 16:50:47

最后一句总结很通俗易懂啊。

支持

星海雪的钟爱 · 发表于 2019-2-21 17:52:51

get,mark一下，这个理解了

你在意在便在 · 发表于 2019-10-28 22:23:46

交作业交作业~
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<style>
  #first {
color: #e74c3c;
  }

  #second {
color: #e67e22;
  }

  #third {
color: #f1c40f;
  }

  #forth {
color: #27ae60;
  }

  #fifth {
color: #2ecc71;
  }
</style>
</head>
<body>
  <div id="first">
<p>我不去想是否能够成功既然选择了编程便只顾一路向前
</p>
   <div id="second">
      <p>希望鱼C也越来越好~
      </p>
      <div id="third">
         <p>用编程改变世界~
         </p>
            <div id="forth">
            <p>不二如是，小甲鱼~
            </p>
               <div id="fifth">
                  <p>你们是真爱~
                  </p>
               </div>
            </div>
      </div>
   </div>
  </div>
</body>
</body>
</html>

账号		自动登录	找回密码
密码			立即注册

不二如是不二如是当前离线 UID 378930 日志相册贡献荣誉积分 62694 狗仔卡	发表于 2017-1-14 16:39:56 \| 显示全部楼层 \|阅读模式购买主题已有 28 人购买本主题需向作者支付 2 鱼币才能浏览本帖被以下淘专辑推荐: · HTML5 & CSS3 - 庖丁解牛\|主题: 205, 订阅: 38
	小甲鱼最新课程 -> https://ilovefishc.com
	回复使用道具举报置顶卡千斤顶显身卡

[庖丁解牛] 0 0 2 2 - CSS的'继承'

本帖被以下淘专辑推荐:

点评

评分

点评

评分

点评

评分

点评

评分

点评

评分

浏览过的版块