CSS样式属性和一般标签属性的不可预知性的测试

yibin 2015-02-09 建站源码 519

  我们可以通过下面的几个小测试来看看,CSS样式属性和一般标签属性的不可预知性!

  看一看下边这些CSS写法,是我在过去的时间里见过的一些问题,看你能猜对吗?你最好是先回复一下,说一说你认为的正确答案是什么!然后再看效是什么样的!这样才有意思!

  1、猜猜看背景是什么颜色?

  答案:
  A:red   B:blue
  你选哪个?

示例代码 [www.dedecms.com]<style>body{ background:blue}</style>
</head>
<body bgcolor="red">
想一想背景是什么颜色?
</body>
  2、猜猜看文字是什么颜色?

  答案:
  A:red   B:blue
  你选哪个?

示例代码 [www.dedecms.com]<style>
.red{ color:red}
body{ color:blue}
</style>
</head>
<body class="red">
想一想文字是什么颜色?
</body>
  3、猜猜看文字是什么颜色?

  答案:
  A:red   B:blue
  你选哪个?

示例代码 [www.dedecms.com]<style>
.red{ color:red}
.blue{ color:blue}
</style>
</head>
<body class="blue red">
想一想文字是什么颜色?
</body>
  4、猜猜看文字是什么颜色?

  答案:
  A:red   B:blue
  你选哪个?

示例代码 [www.dedecms.com]<style>
.blue{ color:blue}
.red{ color:red}
</style>
</head>
<body class="red blue ">
想一想文字是什么颜色?
</body>
  5、这个黑条会怎么样?

  答案:
  A:右边空200px;  B:全屏宽度;
  你选哪个?

示例代码 [www.dedecms.com]<style>
#zishu{ width:100%; margin-left:200px; background:#000}
</style>
<body>
<div id="zishu">这个黑条会怎么样?</div>
</body>
  6、这个黑条会怎么样?

  答案:
  A:左边空200px;  B:全屏宽度;
  你选哪个?

示例代码 [www.dedecms.com]<style>
#zishu{ width:100%; margin-right:-200px; background:#000}
</style>
<body>
<div id="zishu">这个黑条会怎么样?</div>
</body>

  假如你认为没有问题了,那就看一下效果吧!建议你先回复一下你的答案再看效果!:)

  效果如下:
1、
代码调试框 [www.dedecms.com]


[ 可先修改部分代码 再运行查看效果 ]
2、
代码调试框 [www.dedecms.com]


[ 可先修改部分代码 再运行查看效果 ]
3、
代码调试框 [www.dedecms.com]


[ 可先修改部分代码 再运行查看效果 ]
4、
代码调试框 [www.dedecms.com]


[ 可先修改部分代码 再运行查看效果 ]
5、
代码调试框 [www.dedecms.com]


[ 可先修改部分代码 再运行查看效果 ]
6、
代码调试框 [www.dedecms.com]


[ 可先修改部分代码 再运行查看效果 ]
  CSS样式的属性和一般标签属性之间的关系几乎是不可预知的!

扫码添加微信

13013082126 扫描微信 建站咨询 优化咨询