这是一个简单而实用的在线大小写转换工具。它允许用户输入任意文本,并提供三种转换选项:转换为全大写、全小写或首字母大写。

使用这个工具非常简单快捷。用户只需要在输入框中输入想要转换的文本,选择合适的转换类型,然后点击"转换"按钮即可。转换结果会立即显示在输出框中,用户可以直接复制使用。

点击查看代码 
<!DOCTYPE html>

<html lang="en">

<head>

  <meta charset="UTF-8">

  <meta name="viewport" content="width=device-width, initial-scale=1.0">

  <title>英文字母大小写在线转换工具-丢塔游戏网</title>

  <style>

    body {

      font-family: Arial, sans-serif;

      margin: 0;

      padding: 20px;

    }

    h1 {

      text-align: center;

    }

    .container {

      max-width: 600px;

      margin: 0 auto;

    }

    .input-section,

    .output-section {

      margin-bottom: 20px;

    }

    label {

      display: block;

      margin-bottom: 5px;

    }

    textarea {

      width: 100%;

      height: 150px;

      padding: 10px;

      font-size: 16px;

      border: 1px solid #ccc;

      border-radius: 4px;

    }

    select {

      width: 100%;

      padding: 10px;

      font-size: 16px;

      border: 1px solid #ccc;

      border-radius: 4px;

    }

    button {

      display: block;

      width: 100%;

      padding: 10px;

      font-size: 16px;

      background-color: #4CAF50;

      color: white;

      border: none;

      border-radius: 4px;

      cursor: pointer;

    }

  </style>

</head>

<body>

  <h1>英文字母大小写在线转换工具</h1>

  <div class="container">

    <div class="input-section">

      <label for="input-text">输入文本:</label>

      <textarea id="input-text"></textarea>

    </div>

    <div class="conversion-section">

      <label for="conversion-type">选择转换类型:</label>

      <select id="conversion-type">

        <option value="uppercase">转换为大写</option>

        <option value="lowercase">转换为小写</option>

        <option value="titlecase">转换为首字母大写</option>

      </select>

      <button id="convert-button">转换</button>

    </div>

    <div class="output-section">

      <label for="output-text">转换结果:</label>

      <textarea id="output-text" readonly></textarea>

    </div>

  </div>

  <script>

    const inputText = document.getElementById('input-text');

    const conversionType = document.getElementById('conversion-type');

    const convertButton = document.getElementById('convert-button');

    const outputText = document.getElementById('output-text');

    convertButton.addEventListener('click', () => {

      const input = inputText.value;

      const type = conversionType.value;

      let output;

      switch (type) {

        case 'uppercase':

          output = input.toUpperCase();

          break;

        case 'lowercase':

          output = input.toLowerCase();

          break;

        case 'titlecase':

          output = input.replace(/\b\w/g, (char) => char.toUpperCase());

          break;

        default:

          output = input;

      }

      outputText.value = output;

    });

  </script>

</body>

</html>

直接保存为html代码就可以直接使用了。

最近翻译外文用到这个小工具，感觉用处还可以。

这种小工具网上挺多的，自己搞一个省的去找，体验：http://diuta.com/app/zt.html

大佬有好建议意见可以分享一下

英文单词字母大小写在线转换工具html代码的更多相关文章

  1. Unicode编码解码在线转换工具

    // Unicode编码解码在线转换工具 Unicode 是基于通用字符集(Universal Character Set)的标准来发展,并且同时也以书本的形式(The Unicode Standar ...

  2. es6转es5 在线转换工具

    es6转es5 在线转换工具 Babeljs es6console

  3. 实用在线小工具 -- JS代码压缩工具

        实用在线小工具 -- JS代码压缩工具 将JS代码进行压缩可以减少内存占用,下面链接是一个在线JS代码压缩工具,它将多余的空格和换行符压缩了. JS代码压缩工具链接:http://jspack ...

  4. MarkDown/Html在线转换（支持代码高亮，可复制到微信公众号、今日头条）

    MarkDown/Html在线转换能够将md渲染成html并且能保持代码高亮,可以方便的复制待格式的html粘贴到微信公众号,CSDN,简书,博客园,开源中国等. 扫码体验在线助手小程序 我是java ...

  5. yml格式的在线转换工具

    工具1: https://www.toolfk.com/tool-format-yaml 工具2: https://www.toyaml.com/index.html https://www.cnbl ...

  6. Java中字母大小写的转换

    例:String str = "AbC"; 把字符串所有字母变成小写: System.out.println(str.toLowerCase()); 把字符串所有字母大写: Sys ...

  7. unicode 编码在线转换工具

    字符串 unideo的16进制值  

  8. unicode 编码在线转换工具--javascript

    http://www.cnblogs.com/mq0036/p/4007452.html

  9. php 字母大小写转换的函数

    分享下,在php编程中,将字母大小写进行转换的常用函数. 1.将字符串转换成小写strtolower(): 该函数将传入的字符串参数所有的字符都转换成小写,并以小定形式放回这个字符串 2.将字符转成大 ...

  10. unicode 编码在线转换--javascript

    // unicode 编码在线转换工具--javascript 本人在网上搜索,看到有使用javascript做unicode编码转换的,感觉很好玩,所以拿来使用的. 这个功能有目前测试了两种: 1) ...

随机推荐

  1. luogu-P5320题解

    简要题意 设 \(f(n)\) 表示用多米诺骨牌恰好铺满 \(2\times n\) 的平面的方案数,\(g(n)\) 表示用多米诺骨牌恰好铺满 \(3\times n\) 的平面的方案数:设 \(F ...

  2. leetcode每日一题：数组美丽值求和

    引言 ​ 今天的每日一题原题是2278. 字母在字符串中的百分比,直接模拟,逐个匹配,统计letter在原始字符串s中出现的次数,然后再计算所占百分比即可.更换成前几天遇到的更有意思的一题来写这个每日 ...

  3. Avalnoia跨平台实战记录(一)，Avalonia初始化

    前言: 记录一下小菜鸟程序员从WPF一知半解转向Avalonia跨平台桌面端开发的一点记录和感想,我个人是比较喜欢用.NET来开发的,当然,这也和我的技术栈有很大关系,本人只是从大专出来的,在学校里学 ...

  4. 如何0基础学stm32？

    如何0基础学stm32? 作为一个混迹嵌入式领域十余年的老兵,每次看到"0基础学STM32"这样的提问,我都忍不住想笑,又有些无奈.这就像问"如何0基础学开飞机" ...

  5. symfony3.4修改安全验证默认表配置

    #security.yml security: # ··· providers: our_db_provider: entity: class: AppBundle:Users property: u ...

  6. 2025dsfz集训Day4：BFS及其优化

    DAY4: BFS及其优化 \[Designed\ By\ FrankWkd\ -\ Luogu@Lwj54joy,uid=845400 \] 特别感谢 此次课的主讲 - Kwling BFS 广度优 ...

  7. 树莓派智能摄像头实战指南：基于TensorFlow Lite的端到端AI部署

    引言:嵌入式AI的革新力量 在物联网与人工智能深度融合的今天,树莓派这一信用卡大小的计算机正在成为边缘计算的核心载体.本文将手把手教你打造一款基于TensorFlow Lite的低功耗智能监控设备,通 ...

  8. RabbitMQ发布确认及备份交换机

    RabbitMQ发布确认及备份交换机 可以通过设置RabbitMQ的发布确认和失败回退功能来确认消息是否成功发布. 也可以为交换机设置备份交换机,来接收不可路由的消息. demo结构 配置及实现 ap ...

  9. 『Plotly实战指南』--在金融数据可视化中的应用（下）

    在金融市场的复杂博弈中,可视化技术如同精密的导航仪. 传统静态图表正在被交互式可视化取代--据Gartner研究,采用动态可视化的投资机构决策效率提升达47%. 本文的目标是探讨如何利用 Plotly ...

  10. 2024新版Axure RP大数据可视化大屏模板68套及通用组件+PSD文件

    Axure RP数据可视化大屏模板及通用组件库2024新版重新制作了这套新的数据可视化大屏模板及通用组件库V2版.新版本相比于V1版内容更加丰富和全面,但依然秉承"敏捷易用"的制作 ...