דילוג לתוכן
  • דף הבית
  • קטגוריות
  • פוסטים אחרונים
  • משתמשים
  • חיפוש
  • חוקי הפורום
כיווץ
תחומים

תחומים - פורום חרדי מקצועי

💡 רוצה לזכור קריאת שמע בזמן? לחץ כאן!
  1. דף הבית
  2. תכנות
  3. עיצוב אלמנט pre לתצוגת הדפסה

עיצוב אלמנט pre לתצוגת הדפסה

מתוזמן נעוץ נעול הועבר תכנות
16 פוסטים 5 כותבים 331 צפיות 3 עוקבים
  • מהישן לחדש
  • מהחדש לישן
  • הכי הרבה הצבעות
תגובה
  • תגובה כנושא
התחברו כדי לפרסם תגובה
נושא זה נמחק. רק משתמשים עם הרשאות מתאימות יוכלו לצפות בו.
  • chagoldC chagold

    באתר שבפלטפורמת mediawiki. יש שם קטעים בדף שמוגדרים באלמנט pre. כדי שיהיה גלישת שורות תקינה, הטקסט הוגדר בwhite-space: pre-wrap;.

    זה טוב לתצוגת הדף, אבל בתצוגת הדפסה השורות לא גולשות והטקסט נעלם.
    אני מחפש הגדרת css מתאימה, (לפני שאצטרך לשנות את גוף הקוד).

    תודה רבה

    י מנותק
    י מנותק
    יוסף בן שמעון
    כתב ב נערך לאחרונה על ידי
    #2

    @chagold לא הבנתי, זה אלמנט pre או הגדרת CSS?
    ולמה בהדפסה זה לא גולש? בדוגמא להלן זה יוצא גם בהדפסה תקין.
    https://jsfiddle.net/oy6ax5cr/

    chagoldC תגובה 1 תגובה אחרונה
    1
    • י יוסף בן שמעון

      @chagold לא הבנתי, זה אלמנט pre או הגדרת CSS?
      ולמה בהדפסה זה לא גולש? בדוגמא להלן זה יוצא גם בהדפסה תקין.
      https://jsfiddle.net/oy6ax5cr/

      chagoldC מנותק
      chagoldC מנותק
      chagold
      כתב ב נערך לאחרונה על ידי
      #3

      @יוסף-בן-שמעון אלמנט pre אבל כדי לסדר לו את הגלישה יש הגדרת css. ככה:
      a2c60ce7-f163-43d1-a467-61a51a574bf8-image.png

      אני לא יודע למה זה לא תקין במצב הדפסה. (אולי יש שם הגדרות נפרדות להדפסה? איך אני יכול לדעת את זה?)

      י תגובה 1 תגובה אחרונה
      0
      • chagoldC chagold

        @יוסף-בן-שמעון אלמנט pre אבל כדי לסדר לו את הגלישה יש הגדרת css. ככה:
        a2c60ce7-f163-43d1-a467-61a51a574bf8-image.png

        אני לא יודע למה זה לא תקין במצב הדפסה. (אולי יש שם הגדרות נפרדות להדפסה? איך אני יכול לדעת את זה?)

        י מנותק
        י מנותק
        יוסף בן שמעון
        כתב ב נערך לאחרונה על ידי
        #4

        @chagold
        https://www.itsupportguides.com/knowledge-base/google-chrome/how-to-enable-print-view-in-google-chrome-debugger/

        chagoldC תגובה 1 תגובה אחרונה
        3
        • י יוסף בן שמעון

          @chagold
          https://www.itsupportguides.com/knowledge-base/google-chrome/how-to-enable-print-view-in-google-chrome-debugger/

          chagoldC מנותק
          chagoldC מנותק
          chagold
          כתב ב נערך לאחרונה על ידי chagold
          #5

          @יוסף-בן-שמעון תודה.

          מצאתי שיש הגדרות לפרינט.

          ניסיתי לעקוף אותם ע"י הגדרות שבקובץ index.php/מדיה_ויקי:Common.css עם !important. אבל משום מה זה מוגדר ברמה נמוכה יותר והיא לא מושפעת. מצ"ב צילום.
          fe9da45d-3a36-486e-a4d7-c4833e3c0254-image.png

          אם מישהו מכיר mediawiki ויכול להפנות אותי לקבצי הcss של הפרינט.

          תודה רבה.

          dovidD תגובה 1 תגובה אחרונה
          0
          • chagoldC chagold

            @יוסף-בן-שמעון תודה.

            מצאתי שיש הגדרות לפרינט.

            ניסיתי לעקוף אותם ע"י הגדרות שבקובץ index.php/מדיה_ויקי:Common.css עם !important. אבל משום מה זה מוגדר ברמה נמוכה יותר והיא לא מושפעת. מצ"ב צילום.
            fe9da45d-3a36-486e-a4d7-c4833e3c0254-image.png

            אם מישהו מכיר mediawiki ויכול להפנות אותי לקבצי הcss של הפרינט.

            תודה רבה.

            dovidD מנותק
            dovidD מנותק
            dovid
            ניהול
            כתב ב נערך לאחרונה על ידי
            #6

            @chagold דוקא זה נראה שהסטייל שלך הוא הפעיל, איפה אתה רואה שמישהו דורס אותו?
            (ההגדרות בשחור מודגש הם פעילות, ומה שאפור חלש לא חל באלמנט הנבחר, מה שעם קו חוצה נדרס בגלל הגדרה ספציפית או מאוחרת).
            הcommon.css עשוי לדרוס הכל כי הוא נטען אחרון, אז הכל אמור להיות טוב.

            (מחקתי לך את התמונה כי ראו שמה את כתובת האתר בtooltip).

            • מנטור אישי בתכנות והמסתעף – להתקדם לשלב הבא!
            • בכל נושא אפשר ליצור קשר dovid@tchumim.com
            chagoldC תגובה 1 תגובה אחרונה
            1
            • dovidD dovid

              @chagold דוקא זה נראה שהסטייל שלך הוא הפעיל, איפה אתה רואה שמישהו דורס אותו?
              (ההגדרות בשחור מודגש הם פעילות, ומה שאפור חלש לא חל באלמנט הנבחר, מה שעם קו חוצה נדרס בגלל הגדרה ספציפית או מאוחרת).
              הcommon.css עשוי לדרוס הכל כי הוא נטען אחרון, אז הכל אמור להיות טוב.

              (מחקתי לך את התמונה כי ראו שמה את כתובת האתר בtooltip).

              chagoldC מנותק
              chagoldC מנותק
              chagold
              כתב ב נערך לאחרונה על ידי chagold
              #7

              @dovid תודה. הכנסתי שוב תקין.
              ההגדרות שלי הם מה שבאפור חלש.
              מה אני אמור לעשות כדי שהוא כן יתן לאלמנט הנבחר את ההגדרות שבחרתי לו.

              dovidD תגובה 1 תגובה אחרונה
              0
              • chagoldC chagold

                @dovid תודה. הכנסתי שוב תקין.
                ההגדרות שלי הם מה שבאפור חלש.
                מה אני אמור לעשות כדי שהוא כן יתן לאלמנט הנבחר את ההגדרות שבחרתי לו.

                dovidD מנותק
                dovidD מנותק
                dovid
                ניהול
                כתב ב נערך לאחרונה על ידי
                #8

                @chagold אכן טעיתי, גם מה שאפור חלש זה דריסה של ספציפיות, מה שקו חוצה זה רק דריסה של איחור.
                בשביל זה אתה צריך להיות לא פחות ספציפי מהדורס, במקרה הזה הדורס התייחס בפירוש לאלמנט pre ואתה כתבת בכלליות .mw-body.
                שנה את הסלקטור שלך לככה:

                @media print pre {
                 }
                
                • מנטור אישי בתכנות והמסתעף – להתקדם לשלב הבא!
                • בכל נושא אפשר ליצור קשר dovid@tchumim.com
                chagoldC תגובה 1 תגובה אחרונה
                0
                • dovidD dovid

                  @chagold אכן טעיתי, גם מה שאפור חלש זה דריסה של ספציפיות, מה שקו חוצה זה רק דריסה של איחור.
                  בשביל זה אתה צריך להיות לא פחות ספציפי מהדורס, במקרה הזה הדורס התייחס בפירוש לאלמנט pre ואתה כתבת בכלליות .mw-body.
                  שנה את הסלקטור שלך לככה:

                  @media print pre {
                   }
                  
                  chagoldC מנותק
                  chagoldC מנותק
                  chagold
                  כתב ב נערך לאחרונה על ידי chagold
                  #9

                  @dovid אין שינוי (וכמובן לאחר ריענון עמוק)
                  ec38bc35-1f5a-4b0b-93d3-8114f2214077-image.png

                  עריכה: עכשיו אני שם לב שכל מה שיש !important הוא בכלל לא מההגדרות שלי. אני הגדרתי את זה

                  @media print
                   pre {
                      color: black;
                      border: 1px solid #ddd !important;
                      padding: 1em;
                      white-space: pre-wrap !important;
                  
                  
                      background: #f9f9f9 !important;
                      border: 1pt dashed #000;
                      padding: 1em;
                      font-size: 8pt;
                      
                      word-wrap: break-word;
                      overflow: auto;
                  
                  }
                  
                  dovidD תגובה 1 תגובה אחרונה
                  0
                  • chagoldC chagold

                    @dovid אין שינוי (וכמובן לאחר ריענון עמוק)
                    ec38bc35-1f5a-4b0b-93d3-8114f2214077-image.png

                    עריכה: עכשיו אני שם לב שכל מה שיש !important הוא בכלל לא מההגדרות שלי. אני הגדרתי את זה

                    @media print
                     pre {
                        color: black;
                        border: 1px solid #ddd !important;
                        padding: 1em;
                        white-space: pre-wrap !important;
                    
                    
                        background: #f9f9f9 !important;
                        border: 1pt dashed #000;
                        padding: 1em;
                        font-size: 8pt;
                        
                        word-wrap: break-word;
                        overflow: auto;
                    
                    }
                    
                    dovidD מנותק
                    dovidD מנותק
                    dovid
                    ניהול
                    כתב ב נערך לאחרונה על ידי
                    #10

                    @chagold אני לא רואה פה בכלל את הסלקטור שלך עם pre
                    967a6b3f-6637-44c1-847b-2fdad00be08a-image.png

                    • מנטור אישי בתכנות והמסתעף – להתקדם לשלב הבא!
                    • בכל נושא אפשר ליצור קשר dovid@tchumim.com
                    chagoldC תגובה 1 תגובה אחרונה
                    1
                    • dovidD dovid

                      @chagold אני לא רואה פה בכלל את הסלקטור שלך עם pre
                      967a6b3f-6637-44c1-847b-2fdad00be08a-image.png

                      chagoldC מנותק
                      chagoldC מנותק
                      chagold
                      כתב ב נערך לאחרונה על ידי chagold
                      #11

                      @dovid אז מה פספסתי?
                      אני אמור להגדיר במקום אחר מCommon.css?

                      dovidD ל 2 תגובות תגובה אחרונה
                      0
                      • chagoldC chagold

                        @dovid אז מה פספסתי?
                        אני אמור להגדיר במקום אחר מCommon.css?

                        dovidD מנותק
                        dovidD מנותק
                        dovid
                        ניהול
                        כתב ב נערך לאחרונה על ידי
                        #12

                        @chagold לא יודע, זה אמור לעבוד.

                        • מנטור אישי בתכנות והמסתעף – להתקדם לשלב הבא!
                        • בכל נושא אפשר ליצור קשר dovid@tchumim.com
                        תגובה 1 תגובה אחרונה
                        0
                        • chagoldC chagold

                          @dovid אז מה פספסתי?
                          אני אמור להגדיר במקום אחר מCommon.css?

                          ל מנותק
                          ל מנותק
                          לעזור לכולם
                          כתב ב נערך לאחרונה על ידי לעזור לכולם
                          #13

                          @chagold
                          אאל"ט צריך להוסיף עוד סוגריים, כך:

                          @media print {
                           pre {
                            }
                          }
                          

                          https://developer.mozilla.org/en-US/docs/Web/CSS/@media#testing_for_print_and_screen_media_types

                          chagoldC תגובה 1 תגובה אחרונה
                          0
                          • ל לעזור לכולם

                            @chagold
                            אאל"ט צריך להוסיף עוד סוגריים, כך:

                            @media print {
                             pre {
                              }
                            }
                            

                            https://developer.mozilla.org/en-US/docs/Web/CSS/@media#testing_for_print_and_screen_media_types

                            chagoldC מנותק
                            chagoldC מנותק
                            chagold
                            כתב ב נערך לאחרונה על ידי
                            #14

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

                            לגופה של שאלה הזנחתי אותה החלטתי שיותר קל לי (לצרכיי) לייצא את הדף לPDF.

                            תודה רבה.

                            I תגובה 1 תגובה אחרונה
                            0
                            • chagoldC chagold

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

                              לגופה של שאלה הזנחתי אותה החלטתי שיותר קל לי (לצרכיי) לייצא את הדף לPDF.

                              תודה רבה.

                              I מנותק
                              I מנותק
                              ivrtikshoret
                              כתב ב נערך לאחרונה על ידי
                              #15

                              @chagold כתב בעיצוב אלמנט pre לתצוגת הדפסה:

                              לייצא את הדף לPDF.

                              זה בתשלום יש הרבה חינמיים

                              dovidD תגובה 1 תגובה אחרונה
                              0
                              • I ivrtikshoret

                                @chagold כתב בעיצוב אלמנט pre לתצוגת הדפסה:

                                לייצא את הדף לPDF.

                                זה בתשלום יש הרבה חינמיים

                                dovidD מנותק
                                dovidD מנותק
                                dovid
                                ניהול
                                כתב ב נערך לאחרונה על ידי
                                #16

                                @ivrtikshoret כתב בעיצוב אלמנט pre לתצוגת הדפסה:

                                זה בתשלום יש הרבה חינמיים

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

                                • מנטור אישי בתכנות והמסתעף – להתקדם לשלב הבא!
                                • בכל נושא אפשר ליצור קשר dovid@tchumim.com
                                תגובה 1 תגובה אחרונה
                                2
                                תגובה
                                • תגובה כנושא
                                התחברו כדי לפרסם תגובה
                                • מהישן לחדש
                                • מהחדש לישן
                                • הכי הרבה הצבעות


                                בא תתחבר לדף היומי!
                                • התחברות

                                • אין לך חשבון עדיין? הרשמה

                                • התחברו או הירשמו כדי לחפש.
                                • פוסט ראשון
                                  פוסט אחרון
                                0
                                • דף הבית
                                • קטגוריות
                                • פוסטים אחרונים
                                • משתמשים
                                • חיפוש
                                • חוקי הפורום