效果图：
html代码如下：
<!DOCTYPE html>
<html>
<head>
<title>中国国旗</title>
<meta charset="UTF-8">
<link type="text/css" rel="stylesheet" href="css/nationalFlag.css">
</head>
<body>
<div class="father">
<span class="star_main">★</span>
<span class="star1">★</span>
<span class="star2">★</span>
<span class="star3">★</span>
<span class="star4">★</span>
</div>
</body>
</html>js代码如下：
*{
padding:0px;
margin:0px;
}
.father{
border-color:#ccc;
border-width:1px;
border-style:solid;
height:201px;
width:300px;
margin:0px auto;
background-color:red;
}
.star_main{
color:#FCD116;
font-size:3.3em;
width:30px;
height:30px;
/*让star漂浮*/
float:left;
/*定位*/
margin-left:23px;
margin-top:20px;
}
.star1{
color:#FCD116;
font-size:1em;
width:5px;
height:5px;
/*让star漂浮*/
float:left;
/*定位*/
margin-left:23px;
margin-top:20px;
}
.star2{
color:#FCD116;
font-size:1em;
width:5px;
height:5px;
/*让star漂浮*/
float:left;
/*定位*/
margin-left:12px;
margin-top:35px;
}
.star3{
color:#FCD116;
font-size:1em;
width:5px;
height:5px;
/*让star漂浮*/
float:left;
/*定位*/
margin-left:-5px;
margin-top:57px;
}
.star4{
color:#FCD116;
font-size:1em;
width:5px;
height:5px;
/*让star漂浮*/
float:left;
/*定位*/
margin-left:-20px;
margin-top:75px;
}