极客观点
项目管理
HarmonyOS
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>上海科华生物</title>
<link rel="stylesheet" type="text/css" href="css/style1.css"/>
<script src="js/index.js" type="text/javascript" charset="utf-8"></script>
</head>
<body>
<!-- 顶部中英文切换 -->
<div class="nav-top">
<button type="button" class="btn1">English</button>
<button type="button" class="btn1">中文版</button>
</div>
<!-- 菜单：首页 关于我们 新闻公告。。。 -->
<div class="nav-menu">
<img src="img/gengduo.png" class="more" onclick="imgClick()">
</div>
<!-- 滚动banner -->
<div class="banner">
</div>
<!-- 新闻公告 左面图片 -->
<div class="news_left">
</div>
<!-- 新闻公告 右面内容 -->
<div class="new_right">
<!-- 右面内容的上部内容 -->
<div class="new_right_top">
<img src="img/index-search-border.png" class="search-border">
<img src="img/index-search-button.png" onclick="search_click()" class="search-button">
<input type="text" name="" id="" value="" class="search-input" placeholder="请输入您需要的内容"/>
</div>
<!-- 右面内容的中部内容 -->
<div class="new_right_middle">
<div class="new_right_middle_first">
意大利内阁总理孔特访问科华TGS公司
</div>
<div class="new_right_middle_second">
意大利当地时间10月14日下午，意大利内阁总理Giuseppe Conte（朱塞佩·孔特）访问了意大利科华位于意大利南部Morra的实验室。TGS公司CEO Salvatore Cincotti与CFO 冯绍韶接待了意大利总理及坎帕尼亚大区主席。 孔特对TGS...
</div>
<div class="new_right_middle_three">
more >
</div>
<div class="new_right_middle_four">
</div>
</div>
<!-- 右面内容的底部内容 -->
<ul class="new_right_bottom">
<li>科华生物新一代Polaris生化免疫分析系统新品发布</li>
<li>科华生物获得“2019上海制造业企业100强”荣誉</li>
<li>科华生物携手千麦医疗 助力中国医疗健康体外诊断领域创新发展</li>
</ul>
</div>
<!-- 明星产品 -->
<div class="star-product">
<a href="##"><img src="img/index-product-02.png" style="margin-left: 20px; height:250px; margin-top: 10px;"/></a>
<a href="##"><img src="img/index-product-01.png" style="height:250px; float: right; margin-right: 20px; margin-top: 10px;"/> </a>
</div>
</body></html>
*{
margin: 0;
padding: 0;}
.nav-top{
height: 80px;
background-color: skyblue;
background-image: url(../img/nav-name.png);
background-size: 400px 60px;
background-repeat: no-repeat;
background-position: 20px;}
.btn1{
float: right;
margin-top: 20px;
margin-bottom: 20px;
margin-right: 20px;
height: 40px;}
.nav-menu{
height: 100px;
background-image: url(../img/nav-logo.png);
background-size: 250px 80px;
background-repeat: no-repeat;
background-position: 20px;
/* background-color: red; */
/* position: fixed; */
/* z-index: 1000; */}
.more{
float: right;
margin-right: 20px;
margin-top: 30px;
margin-bottom: 30px;
width: 60px;
height: 40px;}
.banner{
background-image: url(../img/flag_news.jpg);
background-repeat: no-repeat;
background-position: center;
height: 600px;
background-size: 1920px 600px;
/* height: 100px;
background-color: red; */}
.news_left{
margin-top: 40px;
background-image: url(../img/index-news.png);
background-repeat: no-repeat;
background-position: center;
height: 650px;
margin-bottom: 40px;}
.new_right{
}
.new_right_top{
height: 100px;
/* background-color: red; */}
.search-border{
margin-right: 20px;
margin-bottom: 20px;
float: right;
width: 600px;
height: 100px;
position: absolute;
/* z-index: -10; */
right: 20px;}
.search-button{
margin-right: 20px;
margin-bottom: 20px;
float: right;
width: 100px;
height: 100px;
position: relative;
/* z-index: 100; */
/* right: -10px; */}
.search-input{
width: 450px;
height: 92px;
float: right;
border-color: transparent;
margin-top: 1px;
/* background-color: red; */
position: relative;
z-index: 100;
font-size: 35px;}
.new_right_middle{
margin-top: 20px;}
.new_right_middle_first{
margin-left: 20px;
font-size: 30px;
font-weight: 600;}
.new_right_middle_second{
margin-left: 20px;
margin-right: 20px;
margin-top: 10px;
font-size: 20px;
/* font-weight: 100; */
color: darkgray;}
.new_right_middle_three{
margin-top: 10px;
margin-right: 30px;
text-align: right;
font-size: 20px;
color: darkgray;}
.new_right_middle_four{
height: 1px;
margin-top: 10px;
margin-left: 20px;
margin-right: 30px;
background-color: black;}
.new_right_bottom{
margin-top: 10px;
margin-left: 40px;
margin-bottom: 10px;
margin-right: 20px;}
.star-product{
background-color: #00ADEE;}
html5
你这个注释掉了啊，另外定位是跟随父级定位的，前提是这个父级也必须是一个定位的元素，如果不是的话会一直向父级查找直到根元素