هذا النص يمكن أن يتم تركيبه على أي تصميم دون مشكلة فلن يبدو وكأنه نص منسوخ، غير منظم، غير منسق.
مشروب لذيذ
x2
طبق الافطار
x3
هذا النص يمكن أن يتم تركيبه على أي تصميم دون مشكلة فلن يبدو وكأنه نص منسوخ، غير منظم، غير منسق.
هذا النص يمكن أن يتم تركيبه على أي تصميم دون مشكلة فلن يبدو وكأنه نص منسوخ، غير منظم، غير منسق.
هذا النص يمكن أن يتم تركيبه على أي تصميم دون مشكلة فلن يبدو وكأنه نص منسوخ، غير منظم، غير منسق.
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: