tailwind+vue实现带代码高亮显示与打字动画本地存储及一键复制的模仿chatgpt聊天对话窗口代码

代码语言:html

所属分类:其他

代码描述:tailwind+vue实现带代码高亮显示与打字动画本地存储及一键复制的模仿chatgpt聊天对话窗口代码,直接输入后端的api接口url就能使用。

代码标签: tailwind vue 代码 高亮 显示 打字 动画 本地 存储 复制 模仿 chatgpt

下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开

<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum=1.0,minimum=1.0,user-scalable=0" />
    <link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/tailwind.2.2.7.css">
    <style>
        body{
            color: #d1d5db;
        }
        pre{
            background: rgba(0,0,0,.5);
            padding: 10px;
            margin: 10px 0;
        }
        #chatbody{
            height: 90vh;
            overflow-y: scroll;
        }
        .controlbar{
    font-size: 12px;
    float: right;
    padding-right: 10px;
    line-height: 50px;
    margin-left: auto;
    cursor: pointer;
}
    </style>
</head>

<body>
    
    
    
    <div id="app">
       
        <div class="bg-gray-900 flex flex-col h-full">
            <main class="flex-grow-1 h-full">
          .........完整代码请登录后点击上方下载按钮下载查看

网友评论0