<!DOCTYPE html> <html> <head> <meta charset=utf-8> <style type="text/css"> * { margin: 0; padding: 0; box-sizing: border-box; } nav ul { height: 2rem; list-style: none; display:flex; flex-direction: row; justify-content:flex-start; justify-content: center; align-items:center; } nav ul li { border: 1px solid black; } nav ul li:first-child { font-size: 1.2rem; } </style> </head> <body> <nav> <ul> <li>home</li> <li>spaceships</li> <li>planets</li> <li>stars</li> </ul> </nav> </body> </html>
考察弹性盒布局
我还以为最后要写align-items:baseline;没想到啊.....