酷代码 AI
菜单
全部AI  /  热门  /  AI写代码神器
服务商

html请写出一个标题栏,左边是logo,右边是按钮

以下是一个简单的HTML代码,实现了一个栏,左边是logo,右边是按钮: ```html <!DOCTYPE html> <html> <head> <title>栏</title> <style> .header { display: flex; align-items: center; justify-content: space-between; padding: 10px; background-color: #f3f3f3; } .logo { width: 50px; height: 50px; background-color: #ddd; } .btn { padding: 10px 20px; background-color: #4caf50; color: #fff; text-decoration: none; } </style> </head> <body> <div class="header"> <div class="logo"></div> <a href="#" class="btn">按钮</a> </div> </body> </html> ``` 在 `style` 标签中,我们定义了名为 `header` 的样式类来设置栏的样式,其中 `display: flex` 属性用于使其内部元素水平排列。`logo` 类定义了 logo 的样式,设置了宽度、高度和颜色。`btn` 类定义了按钮的样式,设置了内边距、颜色、文字颜色和去除了下划线。 在 `body` 中,我们使用 `header` 类作为栏的容器,内部包含一个具有 `logo` 类的 `div` 元素作为 logo,以及一个具有 `btn` 类的 `a` 元素作为按钮。你可以根据你的需求,更改相应的样式和内容。 [2024-06-15 21:10:00 | AI写代码神器 | 783点数解答]

相关提问