医院官网首页 - 专业的医疗服务平台

            </div>
        </li>
        <li>医院概况</li>
        <li>就诊服务

        </li>
        <li>专家介绍</li>
        <li>医联体及对外合作</li>
        <li>招聘/招标/进修</li>
        <li>新闻中心</li>
        <li>院务公开</li>
        <li>其他</li>
        <li class='search'><img src='img/search.svg'/></li>
    </ul>
</div>
<style>
    .search{
        margin-right: 0px;
        width:30px;
        height:30px;
        border-radius: 50%;/*圆形*/
        transition:1s;
        text-align: center;/*让li中的img水平居中*/
        line-height: 30px;/*垂直居中*/
    }
    .search:hover{
        background-color: rgb(51, 99, 160);
        /* background: url(img/bg_blue.jpg)no-repeat;
        border:solid 5px rgb(51,99, 160);
        border-radius: 50%; */
    }
</style>
<!-- <h1>标题标签</h1> 
<img src='img/62964b89aa11365f.png'   /> -->

CSS及作用内容：

1. .top_right: 修饰一个class为'top_right'的div，使其浮动到右边，并设置了宽度和高度。
2. li: 修饰了所有的li标签，去掉了自带的内间距，并设置了浮动、边距、高度、字体大小和过渡效果。
3. .nav_ul>li:nth-child(3): 修饰了第三个li标签，使其下方有一条6px宽的蓝色实线。
4. .home>div: 修饰了一个class为'home'的li标签内的div标签，使其在鼠标悬浮时宽度从0变成40px，高度从0变成6px，实现了一个悬浮效果。
5. .search: 修饰了一个class为'search'的li标签，使其右边距为0，设置了宽度、高度、圆角和过渡效果，并使其中的img标签水平居中、垂直居中。在鼠标悬浮时，背景颜色变成了蓝色，实现了一个简单的hover效果。