2020-01-16/a标签问题/target的使用/两端对齐
a标签问题：
a标签点击之后会回到页面顶端，造成极大的不方便。因此使用js中的——href=“javascript：（0）”即可使页面不跳回页面顶端；
target的使用：
target：
URL（href的指向） 带有后面跟有锚名称 #，指向文档内某个具体的元素。这个被链接的元素就是目标元素(target element)。
:target 选择器可用于选取当前活动的目标元素。
代码
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style type="text/css">
* {
margin: 0;
padding: 0;
}
.header {
width: 400px;
margin: 250px auto;
text-align:justify;
text-justify:inter-word;
text-align: center;
}
.click a {
width: 50px;
height: 50px;
display: block;
background: red;
margin-top: 50px;
line-height: 50px;
text-decoration: none;
display: inline-block;
border-radius: 50%;
box-shadow: 0px 0px 20px 5px rgba(108, 168, 206, 0.6);
}
.con1:target~.click #ck1,
#con2:target~.click #ck2,
#con3:target~.click #ck3{
background: bisque;
font-size: 20px;
color: blue;
}
.cons {
width: 50px;
height: 50px;
position: relative;
background: blueviolet;
display: inline-block;
}
</style>
</head>
<body>
<div class="header">
<div id="con1" class="cons con1">
</div>
<div id="con2" class="cons">2
</div>
<div id="con3" class="cons">
</div>
<div class="click">
<a href="#con1" id="ck1" class="cs1">1</a>
<a href="#con2" id="ck2">2</a>
<a href="#con3" id="ck3">3</a>
</div>
</div>
</body>
</html>
主要是选中元素之后可以改变点击位的样式，用到了选择器，所以需要将点击位放在链接位之后，同时要将链接位置于最外层，以保证其兄弟可选！
两端对齐demo页面
父容器使用：
display:flex;
justify-content:space-between;
设置弹性盒子的有点：行式布局可控，在ul-li使用中，一单行为一ul，对ul使用flex定性，对内部内容可不添加宽度（图片和a标签添加！），发现一个特点是：当外部使用display：flex；justify-content:space-between；之后，其子元素还需要使用的话就不用在添加justify-content:space-between;了！
今天主要对整体的布局进行了修改，一会对点击时间处理一下，明天对轮播图和整体在修改，这个页面就算整体结束了！！
