[上海|荣耀师兄]JS-林璇|2018年08月31日的日报-技能树.IT修真院

发表于： 2018-08-31 23:09:45

1 721

今天完成的事情：（一定要写非常细致的内容，比如说学会了盒子模型，了解了Margin）

今天我完成了部分的关于CSS选择器的东西部分，在师兄推荐给我的菜鸟联盟里面我看了，不过就是对于灵活运用可能还差一点
明天计划的事情：（一定要写非常细致的内容）

明天继续肯任务四，争取做完把
遇到的问题：（遇到什么困难，怎么解决的）

今天使用text align center 的时候居然无效了。我不清楚为什么，我就去百度了下也没有i看懂结果

然后我问了下师兄，我的师兄告诉我，我的标签是写错了嗯，然后换了一个相同的标签，可是发现没有办法居中了

因为我用的是标签选择器，所以两个一样的的标签都可以被控制住，如果我设置为父元素的标签为居中的话，会对两个

都生效了，后来在师兄的帮助下，我运用了直接在上面写上三个控制着元素转换后，直接设置一个左边浮动，一个右边浮动，剩下的居中，不过现在还有个问题疾俗要把他们设定垂直的居中；

我的代码是这样的

<!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>
<link rel="stylesheet" type="text/css" href="task4.css">
</head>

<body>
<header>
<span style="float: left;">关闭</span>
<span>登陆</span>
<span style="float:right;">注册</span>
</header>
</body>

</html>

我的CSS样式是这样的

body{
padding: 0;
margin: 0;
}
span{
margin: 0;
}
header {
width: 720px;
height: 88px;
padding: 0px;
margin: 0px;
background-color: #5fc0cd;
text-align: center;
}
span{
color: white;
font-size: 20px;
display:inline-block;
}