initial

joplin notion extension/Web Development/CSS/Custom upload File Button.md

@@ -0,0 +1,35 @@
+Custom upload File Button
+
+```html
+<input type="file" id="actual-btn"/>
+<label for="actual-btn">Choose File</label>
+```
+
+```css
+.input{
+	display: none;
+}
+
+label {
+  background-color: indigo;
+  color: white;
+  padding: 0.5rem;
+  font-family: sans-serif;
+  border-radius: 0.3rem;
+  cursor: pointer;
+  margin-top: 1rem;
+}
+
+```
+&nbsp;
+or instead of label div or other element can be used too
+&nbsp;
+```html
+<!-- default HTML file upload button -->
+<input type="file" id="actual-btn" style="display: none;" />
+
+<!-- custom file upload button using a <button> element -->
+<div onclick="document.getElementById('actual-btn').click();">Choose File</button>
+
+```
+