¿cuál es el html, css y script para convertir .jpg, .png, .gif y fonts a base64 con area de texto y boton en el html para converitir el archivo y copiar el codigo al mismo tiempo y otro boton para borrar el codigo del area de texto?
A continuación, te presento un ejemplo básico de cómo hacerlo usando HTML, CSS y JavaScript:
HTML:
```
<input type="file" id="file-input">
<button type="button" onclick="convert()">Convertir</button>
<button type="button" onclick="clearText()">Borrar</button>
<textarea id="result"></textarea>
```
Este código HTML crea un campo de carga de archivos, dos botones y un área de texto.
JavaScript:
```
function convert() {
let inputFile = document.getElementById('file-input').files[0];
let reader = new FileReader();
reader.onload = function() {
let base64 = btoa(reader.result);
document.getElementById('result').value = base64;
};
reader.readAsBinaryString(inputFile);
}
function clearText() {
document.getElementById('result').value = "";
}
```
La función "convert" se encarga de leer el archivo cargado, convierte su contenido a base64 y lo muestra en el área de texto "result". La función "clearText" simplemente borra el contenido del área de texto.
CSS:
```
textarea {
width: 100%;
height: 200px;
}
```
Este código CSS establece el ancho y la altura del área de texto.
Ten en cuenta que este ejemplo solo convierte un archivo a la vez y solo incluye los formatos de archivo que mencionaste. También hay limitaciones en cuanto a la capacidad de carga de archivos y la compatibilidad del navegador.