הוסטס - פורום אחסון האתרים הגדול בישראל

הוסטס - פורום אחסון האתרים הגדול בישראל (https://hosts.co.il/forums/index.php)
-   פורום תיכנות (https://hosts.co.il/forums/forumdisplay.php?f=14)
-   -   איך למקם DIV מול DIV? (https://hosts.co.il/forums/showthread.php?t=37379)

Eli-Hai 04-01-07 21:27

איך למקם DIV מול DIV?
 
אני רוצה למקם DIV מול DIV, ולדעת להפריד ביניהם.
אני חושב שהדרך היעילה ביותר לתכנת אתר היא באמצעות DIV.

יש הצעות ודוגמאות?

DorWD 04-01-07 22:38

למה אתה מתכוון? ככה?:
טקסט 1 טקסט 2

אם כן אז אתה עושה דיב בתוך דיב
לדוגמא:
קוד:

<div style="float: left;">טקסט 1 <div style="float: right;">טקסט 2</div</div>
שמתי דיב בתוך דיב שדיב אחד יוזיז את הטקסט לצד שמאל, והדיב השני יוזיז אותו לימין
אני לא מבין כל כך בדיבים אז תקנו אותי אם אני טועה

hpman28 04-01-07 22:45

קוראים לזה css-positioning
 
http://www.elated.com/articles/css-positioning/

זה מקום אחד ללמוד ממנו את העקרונות

omercnet 04-01-07 23:24

ציטוט:

נכתב במקור על ידי hpman28 (פרסם 400481)
http://www.elated.com/articles/css-positioning/

זה מקום אחד ללמוד ממנו את העקרונות

Positioning זאת לא הדרך הממולצת לגרום לאובייטק לעמוד באותו גובה עם אובייטק אחר, כי זה אומר שאתה תמקם אותו אבסולוטית, ואז הדף שלך לא יהיה scalable וחבל

float כמו שצויין פה למעלה זאת הדרך הנכונה, רק שאין צורך לשים את הדיוים אחד בתוך השני
HTML קוד:

<style>
.right { float: right }
.left { float: left }
</style>
<div class='right'>this goes on the right</div>
<div class='left'>this goes on the left</div>

נ.ב
לגבי מקומות ללמוד את העקרונות:
www.w3scools.com
זה המקום המומלץ. לכתוב קוד לפי תקני W3 זאת הדרך הכי נכונה, וזה המקום הרשמי ללמוד ממנו

DorWD 05-01-07 00:24

ציטוט:

נכתב במקור על ידי omercnet (פרסם 400520)
Positioning זאת לא הדרך הממולצת לגרום לאובייטק לעמוד באותו גובה עם אובייטק אחר, כי זה אומר שאתה תמקם אותו אבסולוטית, ואז הדף שלך לא יהיה scalable וחבל

float כמו שצויין פה למעלה זאת הדרך הנכונה, רק שאין צורך לשים את הדיוים אחד בתוך השני
HTML קוד:

<style>
.right { float: right }
.left { float: left }
</style>
<div class='right'>this goes on the right</div>
<div class='left'>this goes on the left</div>

נ.ב
לגבי מקומות ללמוד את העקרונות:
www.w3scools.com
זה המקום המומלץ. לכתוב קוד לפי תקני W3 זאת הדרך הכי נכונה, וזה המקום הרשמי ללמוד ממנו

הוא ביקש שזה יהיה אחד מול השני ולא מתחתיו :)
דקה ננסה לעשות כמו שרשמת

**עריכה: כן, בהחלט אתה צודק, אין להשים את הדיבים אחד בתוך השני

eLad 05-01-07 12:49

ציטוט:

נכתב במקור על ידי omercnet (פרסם 400520)
Positioning זאת לא הדרך הממולצת לגרום לאובייטק לעמוד באותו גובה עם אובייטק אחר, כי זה אומר שאתה תמקם אותו אבסולוטית, ואז הדף שלך לא יהיה scalable וחבל

float כמו שצויין פה למעלה זאת הדרך הנכונה, רק שאין צורך לשים את הדיוים אחד בתוך השני
HTML קוד:

<style>
.right { float: right }
.left { float: left }
</style>
<div class='right'>this goes on the right</div>
<div class='left'>this goes on the left</div>

נ.ב
לגבי מקומות ללמוד את העקרונות:
www.w3scools.com
זה המקום המומלץ. לכתוב קוד לפי תקני W3 זאת הדרך הכי נכונה, וזה המקום הרשמי ללמוד ממנו

שניהם יכולים להיות גם עם float:right רק עם הגדרות רוחב (width)

SmsBanner.net 05-01-07 12:51

הפתרון פשוט מאוד.
משתמשים בCSS, ומגדירים לו כי display יהיה שווה ל inline.
בהצלחה.

ShoQER 05-01-07 15:57

ציטוט:

נכתב במקור על ידי SmsBanner.net (פרסם 400662)
הפתרון פשוט מאוד.
משתמשים בCSS, ומגדירים לו כי display יהיה שווה ל inline.
בהצלחה.

זה לא תמיד יעיל וגם לא תמיד עוזר....אני אישית תמיד משתמש בFLOAT וזה מרצה אותי...אגב לא בהכרח שאחד יהיה LEFT והשני RIGHT....שניהם יכולים להיות RIGHT בתנאי שבראשון ובשני מוגדר רוחב אשר לא יגרום לסטירה מהדף כי אז פשוט הם לא יהיו אחד מול השני...

Eli-Hai 05-01-07 21:34

האם קידוד אתר ל-HTML יהיה יותר יעיל באמצעות DIVים מאשר עם טבלאות?

omercnet 05-01-07 21:53

ציטוט:

נכתב במקור על ידי Eli-Hai (פרסם 401059)
האם קידוד אתר ל-HTML יהיה יותר יעיל באמצעות DIVים מאשר עם טבלאות?

כמובן שDIVים

http://xrl.us/sxrk
לקרוא ולהפנים

Eli-Hai 06-01-07 10:14

אוקי, תודה רבה עומר!

Gal Shafrir 06-01-07 11:07

שאלה נוספת אם אפשר איך אני יכול שיהיו 3 Div על אותה שורה?
כלומר כמו בטבלה בכל אתר שמכבד את עצמו הרי יש 2 עמודות של עדכונים ועמודה של כתבות.
אני רוצה לייעל את עצמי אז איך עושים שזה יהיה ב-Div?

תודה מראש לעוזרים..

tnadav 06-01-07 11:20

ציטוט:

נכתב במקור על ידי DJ G.S (פרסם 401266)
שאלה נוספת אם אפשר איך אני יכול שיהיו 3 Div על אותה שורה?
כלומר כמו בטבלה בכל אתר שמכבד את עצמו הרי יש 2 עמודות של עדכונים ועמודה של כתבות.
אני רוצה לייעל את עצמי אז איך עושים שזה יהיה ב-Div?

תודה מראש לעוזרים..

אני אישית, משתמש לדברים כאלו ב-span...
שזה בעצם div, עם display: inline

Gal Shafrir 06-01-07 11:27

אוקיי תודה

WebProject 06-01-07 11:51

ציטוט:

נכתב במקור על ידי tnadav (פרסם 401271)
אני אישית, משתמש לדברים כאלו ב-span...
שזה בעצם div, עם display: inline

טעות גדולה!, span משמש לטקסטים בלבד, div יכול לכלול בתוכו את כל גוף האתר, אם היית טורח לבדוק, היית רואה שspan מתלבש בידיוק על הטקסט, בשונה מdiv, שאתה יכול להגדיר לו גדלים, דוגמא, במידה ותרצה לשים לטקסט תמונת רקע, אתה תראה תמונה באורך הטקסט, ולא לדוגמא תמונה רחבה ובאמצע התמונה טקסט, בעצם דיב הוא בלוק לעומת span שהוא בעצם הגדרת לטקסט בלבד עם אפשרויות עיצוב קטנות.

במידה ותרצה div באותה שורה, תוכל לתת להם float:right או left לכולם, והם יהיו באותה שורה :)

omercnet 06-01-07 11:51

ציטוט:

נכתב במקור על ידי tnadav (פרסם 401271)
אני אישית, משתמש לדברים כאלו ב-span...
שזה בעצם div, עם display: inline

שלא יהיה בלבול,
DIV הוא בלוק תוכן, אפשר להגדיר כמעט כל מה שרוצים על התוכן שבפנים
SPAN הוא רק תיחום של תוכן, ולא בלוק, אי אפשר לעשות שינויים בסטייל התוכן שבתוכו

WebProject 06-01-07 11:52

ציטוט:

נכתב במקור על ידי omercnet (פרסם 401285)
שלא יהיה בלבול,
DIV הוא בלוק תוכן, אפשר להגדיר כמעט כל מה שרוצים על התוכן שבפנים
SPAN הוא רק תיחום של תוכן, ולא בלוק, אי אפשר לעשות שינויים בסטייל התוכן שבתוכו

קרא תגובה אחת למעלה:) כנראה הגבנו באותו זמן :]

omercnet 06-01-07 11:55

שמתי לב, באותה דקה :)

ShoQER 06-01-07 12:05

בקשר לשאלה של אם אפשר לשים יותר מ2 DIVים בשורה...בהחלט אבל בתנאי שזה לא עולה על רוחב הדף...כי אז זה פשוט יוריד אחד למטה...

omercnet 06-01-07 12:09

ציטוט:

נכתב במקור על ידי OnWheels (פרסם 401293)
בקשר לשאלה של אם אפשר לשים יותר מ2 DIVים בשורה...בהחלט אבל בתנאי שזה לא עולה על רוחב הדף...כי אז זה פשוט יוריד אחד למטה...

אפשר בכוח
לעשות פרופורציונלי לעמוד עם אחוזים ולהוסיף nowarp

ShoQER 06-01-07 12:37

ציטוט:

נכתב במקור על ידי omercnet (פרסם 401295)
אפשר בכוח
לעשות פרופורציונלי לעמוד עם אחוזים ולהוסיף nowarp

נכון...אבל יותר איכותי לדעתי לשמור על רוחב קבוע של הדף ושהרוחב לא יצא מגדר רוחב הדפדפן....

omercnet 06-01-07 12:39

אם תעשה רוחב קבוע לכל הדברים שלך, אתה מתאים את האתר שלך לרזולוציה מאד ספציפית, ואז לא כולם יראו את האתר שלך טוב.
מומלץ את הDIV הראשיים לעשות באחוזים ע"מ שכל אחד יראה את האתר באותה פרופורציה

tnadav 06-01-07 13:00

ציטוט:

נכתב במקור על ידי WebProject (פרסם 401284)
טעות גדולה!, span משמש לטקסטים בלבד, div יכול לכלול בתוכו את כל גוף האתר, אם היית טורח לבדוק, היית רואה שspan מתלבש בידיוק על הטקסט, בשונה מdiv, שאתה יכול להגדיר לו גדלים, דוגמא, במידה ותרצה לשים לטקסט תמונת רקע, אתה תראה תמונה באורך הטקסט, ולא לדוגמא תמונה רחבה ובאמצע התמונה טקסט, בעצם דיב הוא בלוק לעומת span שהוא בעצם הגדרת לטקסט בלבד עם אפשרויות עיצוב קטנות.

במידה ותרצה div באותה שורה, תוכל לתת להם float:right או left לכולם, והם יהיו באותה שורה :)

בכל המקורות שקראתי ראיתי ש- span הוא תאג מיכל שבניגוד ל- div, הוא לא תופס את כל הרוחב, ובכל הניסויים שלי לא נתקעתי בבעיות נוספות...
אבל אם אתה אומר, אתה צודק|Lol| עכשיו תתרכז בדברים יותר חשובים כמו ה- CSS menu הזה שתוקע לי פרויקט שלם;P

ShoQER 06-01-07 13:33

ציטוט:

נכתב במקור על ידי tnadav (פרסם 401341)
בכל המקורות שקראתי ראיתי ש- span הוא תאג מיכל שבניגוד ל- div, הוא לא תופס את כל הרוחב, ובכל הניסויים שלי לא נתקעתי בבעיות נוספות...
אבל אם אתה אומר, אתה צודק|Lol| עכשיו תתרכז בדברים יותר חשובים כמו ה- CSS menu הזה שתוקע לי פרויקט שלם;P

תכלס אפשר להפוך את SPAN לכמו DIV ע"י להפוך אותו לבלוק בעזרת CSS:
display: block;

omercnet 06-01-07 13:37

ציטוט:

נכתב במקור על ידי OnWheels (פרסם 401368)
תכלס אפשר להפוך את SPAN לכמו DIV ע"י להפוך אותו לבלוק בעזרת CSS:
display: block;

למה לעשות שוק?
אתה בחיים לא תעבור validator עם זה..

ShoQER 06-01-07 13:42

ציטוט:

נכתב במקור על ידי omercnet (פרסם 401373)
למה לעשות שוק?
אתה בחיים לא תעבור validator עם זה..

תלוי מה אתה מכניס בוך הSPAN...


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

מופעל באמצעות VBulletin גרסה 3.8.6
כל הזכויות שמורות ©
כל הזכויות שמורות לסולל יבוא ורשתות (1997) בע"מ