html5中侧边栏导航·怎样写

html-css07

html5中侧边栏导航·怎样写,第1张

侧边栏导航标签:

<aside>

<nav>

<ul>

<li>菜单一</li>

<li>菜单二</li>

<li>菜单三</li>

<li>菜单四</li>

<li>菜单五</li>

</ul>

</nav>

</aside>

样式自己加。

 <!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>Document</title>

    <style>

        *{

            margin:0

            padding:0

        }

       ul{

           list-style: none

           background-color: black

           color:blanchedalmond

           width: 100px

           line-height: 48px

       }

       li:nth-of-type(2n+1){

        background-color: blue

       }

       li:hover{

           color: red

           background-color: yellow

       }

    </style>

</head>

<body>

    <ul>

        <li>1</li>

        <li>2</li>

        <li>3</li>

        <li>4</li>

        <li>5</li>

        <li>6</li>

        <li>7</li>

        <li>8</li>

    </ul>

</body>

</html>

 请采纳

html5可以将网页分块, 网页分块意味着将一个页面划分为几个独立的部分,包括内容、菜单、头部、底部、链接等, 这些只要使用一些新的标签。下面是一张html5概念图:

1、<header>网站头部标签

2、<nav>导航标签

3、<article>内容标签

4、<section>文章标签

5、<aside> 侧边栏

6、<footer>网站底部标签