هذا النص يمكن أن يتم تركيبه على أي تصميم دون مشكلة فلن يبدو وكأنه نص منسوخ، غير منظم، غير منسق.
هذا النص يمكن أن يتم تركيبه على أي تصميم دون مشكلة فلن يبدو وكأنه نص منسوخ، غير منظم، غير منسق.
هذا النص يمكن أن يتم تركيبه على أي تصميم دون مشكلة فلن يبدو وكأنه نص منسوخ، غير منظم، غير منسق.
هذا النص يمكن أن يتم تركيبه على أي تصميم دون مشكلة فلن يبدو وكأنه نص منسوخ، غير منظم، غير منسق.
The .file
element is a simple
interactive label that wraps an <input type="file">
. It comprises several sub-elements:
.file
the main
container
.file-label
the actual
interactive and clickable part of the element
.file-input
the
native file input, hidden for styling purposes .file-cta
the upload
call-to-action
.file-icon
an optional
upload icon .file-label
the "Choose a file…" text .file-name
a container for the
chosen file name
<div class="file">
<label class="file-label">
<input class="file-input" type="file" name="resume">
<span class="file-cta">
<span class="file-icon">
<i class="fas fa-upload"></i>
</span>
<span class="file-label">
Choose a file…
</span>
</span>
</label>
</div>
With the .has-name
modifier combined with the .file-name
element
You can move the CTA to the
right side with the .is-right
modifier.
You can also
expand the name to fill up the space with the .is-fullwidth
modifier.
You can have a
boxed block with the .is-boxed
modifier.
You can
combine .has-name
and .is-boxed
.
Colors: You can style the file element by appending one of the 10 color modifiers:
القوالب المتاحة