πŸ“¦ AICodeHunt / base64.kr

πŸ“„ test.html Β· 57 lines
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57<!DOCTYPE html>
<html lang="ko">
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<meta name="viewport" content="width=device-width,initial-scale=1">
		<title>Base64 λ””μ½”λ”© 인코딩 | Base64 μ•”ν˜Έν™” λ³΅ν˜Έν™” - Base64.kr</title>
		<meta name="keywords" content="Base64, Base64 인코딩, Base64 λ””μ½”λ”©, Base64 μ•”ν˜Έν™”, Base64 λ³΅ν˜Έν™”" />
		<meta name="description"
			content="Base64 ν˜•μ‹μ˜ 데이터λ₯Ό λ””μ½”λ”©ν•΄ λ³΄μ„Έμš”. λ˜λŠ” λ‹€μ–‘ν•œ κ³ κΈ‰ μ˜΅μ…˜μ„ μ‚¬μš©ν•˜μ—¬ 인코딩도 ν•΄λ³΄μ„Έμš”. 저희 μ‚¬μ΄νŠΈμ—λŠ” 온라인 데이터 λ³€ν™˜ 도ꡬ가 κ°„νŽΈν•˜κ²Œ μ‚¬μš©ν•  수 μžˆμŠ΅λ‹ˆλ‹€.">
		<link rel="icon" href="image/base64-16.png" sizes="16x16" type="image/png">
		<link rel="icon" href="image/base64-32.png" sizes="32x32" type="image/png">
		<link rel="icon" href="image/base64.png" sizes="64x64" type="image/png">
		<link rel="canonical" href="https://base64.kr" />
		<link href="https://cdn.jsdelivr.net/npm/tailwindcss@2.2.19/dist/tailwind.min.css" rel="stylesheet">
	</head>
	<body class="bg-gray-50">
		<header class="head-bg text-white py-2 pl-4 pr-4 md:pl-20 md:pr-20">
			<h1 class="text-left text-xl font-bold"><a href="https://base64.kr">Base64.kr</a></h1>
			<div class="flex space-x-2 justify-end">
				<a class="text-white hover:text-gray-300 font-bold" href="https://base64.kr">ν•œκ΅­μ–΄</a>
				<a class="text-white hover:text-gray-300" href="https://base64.kr/zh">δΈ­ζ–‡</a>
				<a class="text-white hover:text-gray-300" href="https://base64.kr/en">English</a>
			</div>
		</header>
		<div class="text-slate-900 bg-white p-6">
			<h1 class="text-3xl font-bold text-center">Base64 λ””μ½”λ”© 인코딩</h1>
		</div>
		<main class="px-4 py-4 flex justify-center">
			<div class="custom-container w-full sm:w-full md:w-1/2 max-w-900 bg-white p-6 rounded-lg shadow-md">
				<textarea id="inputText"
					class="w-full h-40 sm:h-30 mb-4 p-2 resize-y border rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500"
					placeholder="Base64둜 인코딩 λ˜λŠ” λ””μ½”λ”©ν•  문자λ₯Ό μž…λ ₯ν•˜μ„Έμš”."></textarea>
				<h3 class="mb-4 text-gray-500">Base64 인코딩 λ˜λŠ” λ””μ½”λ”©λœ 결과:</h3>
				<textarea id="outputText"
					class="w-full h-40 sm:h-30 p-2 border-0 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 bg-blue-50 text-blue-700"
					placeholder="" readonly></textarea>
				<div id="copyDiv"
					class="bg-blue-50 text-blue-700 text-left rounded-lg p-2 flex items-center justify-center space-x-2">
					<span id="copyBtn">Copy</span>
				</div>
				<div class="flex justify-center mt-4">
					<button id="decodeBtn"
						class="mr-2 px-4 py-2 bg-blue-600 text-white rounded-md hover:bg-blue-700 focus:outline-none text-base sm:text-sm">λ””μ½”λ”©</button>
					<button id="encodeBtn"
						class="mr-2 px-4 py-2 bg-blue-500 text-white rounded-md hover:bg-indigo-600 focus:outline-none text-base sm:text-sm">인코딩</button>
					<button id="swapBtn"
						class="px-4 py-2 bg-gray-100 text-black rounded-md hover:bg-blue-50 focus:outline-none text-base sm:text-sm">κ΅ν™˜</button>
				</div>
			</div>
		</main>
		<div class="bg-gray-100 text-gray-500 text-center rounded-lg p-2 text-sm mt-60">
			온라인 Base64 디코딩인코딩도ꡬ Copyright Β© <span class="text-blue-700">base64.kr</span>
		</div>
		<script src="script.js" type="text/javascript"></script>
		<link rel="stylesheet" type="text/css" href="style.css">
	</body>
</html>