css设置div的2个span一个在最左边,一个在最右边

界面:

代码:

bash 复制代码
<html>

<style>

.top span {
  display: block;
  position: absolute;
  margin: 0 20px; /* 添加边距以避免太靠近边缘 */
}

.top span:nth-child(1) {
  left: 5px; /* 调整左侧位置 */
}

.top span:nth-child(2) {
  right: 5px; /* 调整右侧位置 */
}

</style>

<body>
  <div class="top">
      <span>最左边</span>
      <span>最右边</span>
  </div>
</body>

</html>
相关推荐
QianhangQianping13 小时前
一块大屏的数据在浏览器里怎么变成画面:背景、子屏、前景三层结构
前端·低代码·架构·编辑器·数据可视化·大屏可视化
梦想很大很大14 小时前
让 Codex 自由发挥,给 nvm-desktop 换个 UI
前端·人工智能·设计
蓝莓味的口香糖14 小时前
【VUE】【CSS】Vue移动端适配主流方案总结
前端·css·vue.js
shennv88814 小时前
接入大模型流式输出后,文字偶尔乱码?问题可能出在前端
前端
csj5014 小时前
前端基础之《React(16)—Modal组件封装》
前端·react.js
雨季mo浅忆14 小时前
Vue关于前端XSS漏洞修复方案
前端·xss
上火的金鱼妹14 小时前
关于多进程sse连接通知的实战
javascript·状态模式·sse
切糕师学AI14 小时前
el-select-v2 深度解析:用虚拟滚动解决海量数据下拉选择性能瓶颈
前端·vue.js·elementui·el-select-v2
徐小夕14 小时前
JitOffice:把办公、AI 与审批装进同一个平台
前端·vue.js·github
徐小夕14 小时前
万字分享:为什么我们要自研Word解析引擎?JitWord 解析引擎 4.0 深度复盘
前端·vue.js·github