[HTML/CSS基础]*{display:}流弊过头了-慕课网

首页课程实战体系课手记专栏慕课教程

[HTML/CSS基础]*{display:}流弊过头了

来源：13-2 排队显示-流动模型（一）

svc124

2016-03-26 15:47

如何克制一下才好，不要把<title>和<style>都作用进进来

写回答关注

10回答

忆_卿

2016-04-20 18:05:46

已采纳

<title>和<style>都有一个默认的display：none属性，这个属性的作用是把网页上的某个元素给隐藏起来，但是你在*{} 里面设置了display:block，把默认的属性给掩盖了，所有的元素显示为块级元素，所以在浏览器上可以看到<tilte>和<style>里的内容，你把*{}通用选择器改成body{} 就可以得到你想要的效果了。

1 0

svc124

Merci

2016-04-22 11:45:56

共 1 条回复 >
svc124

2016-04-22 13:32:26

知道的，学的细节没用都忘了，谢谢

0 0
忆_卿

2016-04-22 12:09:54

懂你的意思了。。回答你这个问题 ( 但是在title标签内添加一个行内样式diaplay:none却不能解决，根据样式优先级不应该是这样啊，难道*{}全局样式格式化可以不受这条规则的约束？)

你是代码写错了你也可以在<style>里面
title{
display:none;
}这样写都是有效果的。自己可以测试一下，写内联样式时记得加 style=""

0 0
忆_卿

2016-04-22 11:53:27

给代码， - - 没看懂你想表达什么。

0 0
忆_卿

2016-04-20 17:56:59

懂你的意思了.。你把*{}通用选择器改成body{}就可以了。但是我也觉得好奇怪。。display:block是将元素显示为块级元素，为什么<style> <title>里的东西怎么会显示出来。

2 0

忆_卿回复svc124

给代码没看懂你想表达什么 - - ；

2016-04-22 11:54:11

共 2 条回复 >
忆_卿

2016-04-20 17:43:00

你 -- 想表达什么都没看懂你想说什么。。。

0 0
风花雪月不念秋

2016-03-26 16:08:52

问题在第14行 *代表是页面的所有元素然后所有元素都被你转化为块级元素了

1 0

svc124

好像不是这个问题改为inline和inline-block都一样

2016-03-26 16:14:41

共 1 条回复 >
风_起

2016-03-26 16:04:52

额，并没有作用进来。

1 0

svc124

我也不知道咋回事，但稍微改一下后*{}作用范围的确不一样，例如<head>改成这样 <!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>流动模式下的块状元素</title> <style type="text/css"> *{ width:300px; height:100px; border:1px solid red; } </style> </head> //倒感觉是个BUG了

2016-03-26 16:23:27

共 1 条回复 >
jiangjiajia

2016-03-26 16:01:10

你用body{}好了

2 0

jiangj...

body{ display:; width:100px; float:left; }

2016-03-26 16:20:11

共 2 条回复 >
刘陈欣

2016-03-26 15:58:04

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>流动模式下的块状元素</title>
<style type="text/css">
#box1{
    width:300px;
    height:100px;
}
div,h1,p{
    border:1px solid red;
}
*{
    display:;
    width:100px;
    float:left;
}
</style>
</head>
<body>
    <div id="box2">box2</div>
    <h1>标题</h1>
    <p>文本段文本段文本段文本段文本段文本段文本段文本段文本段文本段文本段文本段文本段文本段文本段文本段文本段。</p>

    <div id="box1">box1</div>
</body>
</html>

0 0