הוסטס - פורום אחסון האתרים הגדול בישראל - איך אפשר לעצב את input type="file"

עמוד 1 מתוך 2

הוסטס - פורום אחסון האתרים הגדול בישראל (https://hosts.co.il/forums/index.php)

- פורום תיכנות (https://hosts.co.il/forums/forumdisplay.php?f=14)

- - איך אפשר לעצב את input type="file" (https://hosts.co.il/forums/showthread.php?t=74479)

sts	13-05-09 02:44

איך אפשר לעצב את input type="file"

אני שעהה מנסה שעה לא מצליח
מישהו פה יודע איך?

SniR-S

13-05-09 07:55

אתה יכול בכל מיני דרכים,
ראשונה, אתה מוסיף לו את הקוד הבא:

HTML קוד:

style="background-color: #666;"

דרך נוספת זה לקבוע אותו כאלמנט class מסויים, ואז להגדיר אותו ב css, לדוגמא:
HTML

HTML קוד:

class="uploadfile"

CSS

HTML קוד:

.uploadfile {

background-color: #666;

}

אתה יכול לקבוע את input בכללי כעיצוב משלך ב CSS ..
ויש עוד דרכים, אבל בעיקרון זה ככה..

Scolpy

13-05-09 09:06

הנה כמה דוגמאות לעיצוב כפתורים עם שימוש בגליונות CSS(תקן XHTML 1.1 STRICT):

HTML קוד:

input[type="file"]{

    border: 1px solid #ffffff;

    border-top: 1px solid #ffffff;

    border-bottom: 1px solid #ffffff;

}

HTML קוד:



input[type="file"]:hover, input[type="file"]:focus{

    border: 1px solid #ffffff;

    border-top: 1px solid #ffffff;

    border-bottom: 1px solid #ffffff;

}

HTML קוד:



input[type="file"] {

    background: url('input_background.png') repeat-x;

    border: 1px solid #fff;

    height: 10px;

    padding: 0 3px 0 3px;

}

כמובן שישנן עוד וריאציות, אך זה בכללי :)

בהצלחה!

sts	13-05-09 09:25

את כל אלה אני יודע איך לעשות
אבל אני רוצה לעשות את הכפתור של "עיון..." כתמונה שלי שאני עיצבתי
ואת שורת הטקסט להשאיר איך שהיא

SniR-S

13-05-09 10:02

HTML קוד:

<input type="image" src="image.gif" name="image" width="60" height="30">

sts	13-05-09 10:21

לא עובד
כשאתה עושה <input type=tile>
אז אתה מקבל 2 דברים
כפתור "עיון..."
ושורת טקסט ששם כתוב הקובץ שבחרת
עכשיו כשאני עשיתי <input type="file" class="myclass"> אז הוא יוצא דפוק כזה
איך אפשר לעצב רק את הכפתור ולא את השורת טקסט

IsraKal.co.il

13-05-09 10:37

ציטוט:

נכתב במקור על ידי sts (פרסם 714689)

תעתיק לכאן את שורת הקוד הקיים, על מנת להבין בצורה ברורה יותר את העניין.

sts	13-05-09 11:12

HTML קוד:

<form method="post" style="position:absolute; left: 442px; top: 118px; width: 78px;">

<input name="browse" type="file" class="upload-select" />

<input name="upload" type="image" src="images/uploadbutton.gif">

</form>

HTML קוד:

.upload-select {

        background-image:url("images/selectfile.gif");

        width:75px;

        height:30px;

        position:absolute;

        left: 82px;

        top: 1px;

}

וזה מה שרואים
http://up73.siz.co.il/up2/jmnzmtxeind4.jpg

אני רוצה להחליף את הכפתור "עיון..." בכפתור שאני עיצבתי שה-class שלו זה upload-select
איך אני עושה את זה?

dor77

13-05-09 14:08

http://www.ryboe.com/2007/01/07/usin...it-button.html

בהצלחה (:

Erez | TrustMedia.co.il

13-05-09 14:16

לא חושב שזה אפשרי,אבל אתה יכול לעשות תיבת העלאת קובץ בפלאש ואז לעצב איך שבאלך

כל הזמנים הם GMT +2. הזמן כעת הוא 02:10.

עמוד 1 מתוך 2

הצג 40 הודעות באשכול על דף אחד