Retour

Navigation principale (navigation)

La navigation principale est l'élément central de la navigation au sein du site, il oriente l’utilisateur à travers les grandes sections du site et sur éventuellement plusieurs niveaux de profondeur.

Documentation

Navigation Principale

<nav class="fr-nav" id="navigation-5161" role="navigation" aria-label="Menu principal">
    <ul class="fr-nav__list">
        <li class="fr-nav__item">
            <button class="fr-nav__btn" aria-expanded="false" aria-controls="collapse-5163">Entrée menu</button>
            <div class="fr-collapse fr-menu" id="collapse-5163">
                <ul class="fr-menu__list">
                    <li>
                        <a class="fr-nav__link" href="#" target="_self" id="nav-5164">Lien de navigation nav-5164</a>
                    </li>
                    <li>
                        <a class="fr-nav__link" href="#" target="_self" id="nav-5165">Lien de navigation nav-5165</a>
                    </li>
                    <li>
                        <a class="fr-nav__link" href="#" target="_self" id="nav-5166">Lien de navigation nav-5166</a>
                    </li>
                    <li>
                        <a class="fr-nav__link" href="#" target="_self" id="nav-5167">Lien de navigation nav-5167</a>
                    </li>
                    <li>
                        <a class="fr-nav__link" href="#" target="_self" id="nav-5168">Lien de navigation nav-5168</a>
                    </li>
                    <li>
                        <a class="fr-nav__link" href="#" target="_self" id="nav-5169">Lien de navigation nav-5169</a>
                    </li>
                    <li>
                        <a class="fr-nav__link" href="#" target="_self" id="nav-5170">Lien de navigation nav-5170</a>
                    </li>
                    <li>
                        <a class="fr-nav__link" href="#" target="_self" id="nav-5171">Lien de navigation nav-5171</a>
                    </li>
                </ul>
            </div>
        </li>
        <li class="fr-nav__item">
            <button class="fr-nav__btn" aria-expanded="false" aria-controls="collapse-5173">Entrée mega menu</button>
            <div class="fr-collapse fr-mega-menu" id="collapse-5173">
                <div class="fr-container fr-container--fluid fr-container-lg">
                    <div class="fr-grid-row fr-grid-row-lg--gutters">
                        <div class="fr-col-12 fr-mb-n3v">
                            <button class="fr-btn--close fr-btn" aria-controls="collapse-5173" id="button-5309" title="Fermer">
                                Fermer
                            </button>
                        </div>
                        <div class="fr-col-12 fr-col-lg-8 fr-col-offset-lg-4--right fr-mb-4v">
                            <div class="fr-mega-menu__leader">
                                <p class="fr-hidden fr-unhidden-lg"></p>
                            </div>
                        </div>
                        <div class="fr-col-12 fr-col-lg-3">
                            <h5 class="fr-mega-menu__category">
                                <a class="fr-nav__link" href="#" target="_self" id="category-5174">Nom de catégorie</a>
                            </h5>
                            <ul class="fr-mega-menu__list">
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5175">Lien de navigation nav-5175</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5176">Lien de navigation nav-5176</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5177">Lien de navigation nav-5177</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5178">Lien de navigation nav-5178</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5179">Lien de navigation nav-5179</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5180">Lien de navigation nav-5180</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5181">Lien de navigation nav-5181</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5182">Lien de navigation nav-5182</a>
                                </li>
                            </ul>
                        </div>
                        <div class="fr-col-12 fr-col-lg-3">
                            <h5 class="fr-mega-menu__category">
                                <a class="fr-nav__link" href="#" target="_self" id="category-5183">Nom de catégorie</a>
                            </h5>
                            <ul class="fr-mega-menu__list">
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5184">Lien de navigation nav-5184</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5185">Lien de navigation nav-5185</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5186">Lien de navigation nav-5186</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5187">Lien de navigation nav-5187</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5188">Lien de navigation nav-5188</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5189">Lien de navigation nav-5189</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5190">Lien de navigation nav-5190</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5191">Lien de navigation nav-5191</a>
                                </li>
                            </ul>
                        </div>
                        <div class="fr-col-12 fr-col-lg-3">
                            <h5 class="fr-mega-menu__category">
                                <a class="fr-nav__link" href="#" target="_self" id="category-5192">Nom de catégorie</a>
                            </h5>
                            <ul class="fr-mega-menu__list">
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5193">Lien de navigation nav-5193</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5194">Lien de navigation nav-5194</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5195" aria-current="page">Lien de navigation nav-5195</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5196">Lien de navigation nav-5196</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5197">Lien de navigation nav-5197</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5198">Lien de navigation nav-5198</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5199">Lien de navigation nav-5199</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5200">Lien de navigation nav-5200</a>
                                </li>
                            </ul>
                        </div>
                        <div class="fr-col-12 fr-col-lg-3">
                            <h5 class="fr-mega-menu__category">
                                <a class="fr-nav__link" href="#" target="_self" id="category-5201">Nom de catégorie</a>
                            </h5>
                            <ul class="fr-mega-menu__list">
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5202">Lien de navigation nav-5202</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5203">Lien de navigation nav-5203</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5204">Lien de navigation nav-5204</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5205">Lien de navigation nav-5205</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5206">Lien de navigation nav-5206</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5207">Lien de navigation nav-5207</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5208">Lien de navigation nav-5208</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5209">Lien de navigation nav-5209</a>
                                </li>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
        </li>
        <li class="fr-nav__item">
            <a class="fr-nav__link" href="#" target="_self" id="nav-5210">accès direct nav-5210</a>
        </li>
        <li class="fr-nav__item">
            <button class="fr-nav__btn" aria-expanded="false" aria-controls="collapse-5212" aria-current="true">Entrée menu</button>
            <div class="fr-collapse fr-menu" id="collapse-5212">
                <ul class="fr-menu__list">
                    <li>
                        <a class="fr-nav__link" href="#" target="_self" id="nav-5213">Lien de navigation nav-5213</a>
                    </li>
                    <li>
                        <a class="fr-nav__link" href="#" target="_self" id="nav-5214">Lien de navigation nav-5214</a>
                    </li>
                    <li>
                        <a class="fr-nav__link" href="#" target="_self" id="nav-5215" aria-current="page">Lien de navigation nav-5215</a>
                    </li>
                    <li>
                        <a class="fr-nav__link" href="#" target="_self" id="nav-5216">Lien de navigation nav-5216</a>
                    </li>
                    <li>
                        <a class="fr-nav__link" href="#" target="_self" id="nav-5217">Lien de navigation nav-5217</a>
                    </li>
                    <li>
                        <a class="fr-nav__link" href="#" target="_self" id="nav-5218">Lien de navigation nav-5218</a>
                    </li>
                    <li>
                        <a class="fr-nav__link" href="#" target="_self" id="nav-5219">Lien de navigation nav-5219</a>
                    </li>
                    <li>
                        <a class="fr-nav__link" href="#" target="_self" id="nav-5220">Lien de navigation nav-5220</a>
                    </li>
                </ul>
            </div>
        </li>
        <li class="fr-nav__item">
            <button class="fr-nav__btn" aria-expanded="false" aria-controls="collapse-5222">Entrée mega menu</button>
            <div class="fr-collapse fr-mega-menu" id="collapse-5222">
                <div class="fr-container fr-container--fluid fr-container-lg">
                    <div class="fr-grid-row fr-grid-row-lg--gutters">
                        <div class="fr-col-12 fr-mb-n3v">
                            <button class="fr-btn--close fr-btn" aria-controls="collapse-5222" id="button-5310" title="Fermer">
                                Fermer
                            </button>
                        </div>
                        <div class="fr-col-12 fr-col-lg-8 fr-col-offset-lg-4--right fr-mb-4v">
                            <div class="fr-mega-menu__leader">
                                <h4 class="fr-h4 fr-mb-2v">Titre éditorialisé</h4>
                                <p class="fr-hidden fr-unhidden-lg">Lorem [...] elit ut.</p>
                                <a class="fr-link fr-icon-arrow-right-line fr-link--icon-right" id="link-5223" href="#">
                                    Voir toute la rubrique
                                </a>
                            </div>
                        </div>
                        <div class="fr-col-12 fr-col-lg-3">
                            <h5 class="fr-mega-menu__category">
                                <a class="fr-nav__link" href="#" target="_self" id="category-5224">Nom de catégorie</a>
                            </h5>
                            <ul class="fr-mega-menu__list">
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5225">Lien de navigation nav-5225</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5226">Lien de navigation nav-5226</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5227">Lien de navigation nav-5227</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5228">Lien de navigation nav-5228</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5229">Lien de navigation nav-5229</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5230">Lien de navigation nav-5230</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5231">Lien de navigation nav-5231</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5232">Lien de navigation nav-5232</a>
                                </li>
                            </ul>
                        </div>
                        <div class="fr-col-12 fr-col-lg-3">
                            <h5 class="fr-mega-menu__category">
                                <a class="fr-nav__link" href="#" target="_self" id="category-5233">Nom de catégorie</a>
                            </h5>
                            <ul class="fr-mega-menu__list">
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5234">Lien de navigation nav-5234</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5235">Lien de navigation nav-5235</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5236">Lien de navigation nav-5236</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5237">Lien de navigation nav-5237</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5238">Lien de navigation nav-5238</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5239">Lien de navigation nav-5239</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5240">Lien de navigation nav-5240</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5241">Lien de navigation nav-5241</a>
                                </li>
                            </ul>
                        </div>
                        <div class="fr-col-12 fr-col-lg-3">
                            <h5 class="fr-mega-menu__category">
                                <a class="fr-nav__link" href="#" target="_self" id="category-5242">Nom de catégorie</a>
                            </h5>
                            <ul class="fr-mega-menu__list">
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5243">Lien de navigation nav-5243</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5244">Lien de navigation nav-5244</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5245" aria-current="page">Lien de navigation nav-5245</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5246">Lien de navigation nav-5246</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5247">Lien de navigation nav-5247</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5248">Lien de navigation nav-5248</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5249">Lien de navigation nav-5249</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5250">Lien de navigation nav-5250</a>
                                </li>
                            </ul>
                        </div>
                        <div class="fr-col-12 fr-col-lg-3">
                            <h5 class="fr-mega-menu__category">
                                <a class="fr-nav__link" href="#" target="_self" id="category-5251">Nom de catégorie</a>
                            </h5>
                            <ul class="fr-mega-menu__list">
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5252">Lien de navigation nav-5252</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5253">Lien de navigation nav-5253</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5254">Lien de navigation nav-5254</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5255">Lien de navigation nav-5255</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5256">Lien de navigation nav-5256</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5257">Lien de navigation nav-5257</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5258">Lien de navigation nav-5258</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5259">Lien de navigation nav-5259</a>
                                </li>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
        </li>
        <li class="fr-nav__item">
            <a class="fr-nav__link" href="#" target="_self" id="nav-5260">accès direct nav-5260</a>
        </li>
        <li class="fr-nav__item">
            <button class="fr-nav__btn" aria-expanded="false" aria-controls="collapse-5262">Entrée mega menu</button>
            <div class="fr-collapse fr-mega-menu" id="collapse-5262">
                <div class="fr-container fr-container--fluid fr-container-lg">
                    <div class="fr-grid-row fr-grid-row-lg--gutters">
                        <div class="fr-col-12 fr-mb-n3v">
                            <button class="fr-btn--close fr-btn" aria-controls="collapse-5262" id="button-5311" title="Fermer">
                                Fermer
                            </button>
                        </div>
                        <div class="fr-col-12 fr-col-lg-8 fr-col-offset-lg-4--right fr-mb-4v">
                            <div class="fr-mega-menu__leader">
                                <p class="fr-hidden fr-unhidden-lg"></p>
                            </div>
                        </div>
                        <div class="fr-col-12 fr-col-lg-3">
                            <h5 class="fr-mega-menu__category">
                                <a class="fr-nav__link" href="#" target="_self" id="category-5263">Nom de catégorie</a>
                            </h5>
                            <ul class="fr-mega-menu__list">
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5264">Lien de navigation nav-5264</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5265">Lien de navigation nav-5265</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5266">Lien de navigation nav-5266</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5267">Lien de navigation nav-5267</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5268">Lien de navigation nav-5268</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5269">Lien de navigation nav-5269</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5270">Lien de navigation nav-5270</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5271">Lien de navigation nav-5271</a>
                                </li>
                            </ul>
                        </div>
                        <div class="fr-col-12 fr-col-lg-3">
                            <h5 class="fr-mega-menu__category">
                                <a class="fr-nav__link" href="#" target="_self" id="category-5272">Nom de catégorie</a>
                            </h5>
                            <ul class="fr-mega-menu__list">
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5273">Lien de navigation nav-5273</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5274">Lien de navigation nav-5274</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5275">Lien de navigation nav-5275</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5276">Lien de navigation nav-5276</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5277">Lien de navigation nav-5277</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5278">Lien de navigation nav-5278</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5279">Lien de navigation nav-5279</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5280">Lien de navigation nav-5280</a>
                                </li>
                            </ul>
                        </div>
                        <div class="fr-col-12 fr-col-lg-3">
                            <h5 class="fr-mega-menu__category">
                                <a class="fr-nav__link" href="#" target="_self" id="category-5281">Nom de catégorie</a>
                            </h5>
                            <ul class="fr-mega-menu__list">
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5282">Lien de navigation nav-5282</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5283">Lien de navigation nav-5283</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5284" aria-current="page">Lien de navigation nav-5284</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5285">Lien de navigation nav-5285</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5286">Lien de navigation nav-5286</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5287">Lien de navigation nav-5287</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5288">Lien de navigation nav-5288</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5289">Lien de navigation nav-5289</a>
                                </li>
                            </ul>
                        </div>
                        <div class="fr-col-12 fr-col-lg-3">
                            <h5 class="fr-mega-menu__category">
                                <a class="fr-nav__link" href="#" target="_self" id="category-5290">Nom de catégorie</a>
                            </h5>
                            <ul class="fr-mega-menu__list">
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5291">Lien de navigation nav-5291</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5292">Lien de navigation nav-5292</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5293">Lien de navigation nav-5293</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5294">Lien de navigation nav-5294</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5295">Lien de navigation nav-5295</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5296">Lien de navigation nav-5296</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5297">Lien de navigation nav-5297</a>
                                </li>
                                <li>
                                    <a class="fr-nav__link" href="#" target="_self" id="nav-5298">Lien de navigation nav-5298</a>
                                </li>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
        </li>
        <li class="fr-nav__item">
            <button class="fr-nav__btn" aria-expanded="false" aria-controls="collapse-5300">Entrée menu</button>
            <div class="fr-collapse fr-menu" id="collapse-5300">
                <ul class="fr-menu__list">
                    <li>
                        <a class="fr-nav__link" href="#" target="_self" id="nav-5301">Lien de navigation nav-5301</a>
                    </li>
                    <li>
                        <a class="fr-nav__link" href="#" target="_self" id="nav-5302">Lien de navigation nav-5302</a>
                    </li>
                    <li>
                        <a class="fr-nav__link" href="#" target="_self" id="nav-5303">Lien de navigation nav-5303</a>
                    </li>
                    <li>
                        <a class="fr-nav__link" href="#" target="_self" id="nav-5304">Lien de navigation nav-5304</a>
                    </li>
                    <li>
                        <a class="fr-nav__link" href="#" target="_self" id="nav-5305">Lien de navigation nav-5305</a>
                    </li>
                    <li>
                        <a class="fr-nav__link" href="#" target="_self" id="nav-5306">Lien de navigation nav-5306</a>
                    </li>
                    <li>
                        <a class="fr-nav__link" href="#" target="_self" id="nav-5307">Lien de navigation nav-5307</a>
                    </li>
                    <li>
                        <a class="fr-nav__link" href="#" target="_self" id="nav-5308">Lien de navigation nav-5308</a>
                    </li>
                </ul>
            </div>
        </li>
    </ul>
</nav>

Paramètres d’affichage

Choisissez un thème pour personnaliser l’apparence du site.