2011 7 יולי 2011

שאלת CSS גרזן

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

כתוב קטע CSS שיציג פסקה בכחול בדפדפנים ישנים יותר, אדום בדפדפנים חדשים יותר, ירוק ושחור IE6 IE7

#content p{color:blue}
html>body #content p {color:red}
* html #content p{color:green}
html>body #content p {*color:black;}


2011 18 פבואר 2011

IE שגיאה Javascript: האובייקט אינו תומך במאפיין זה או בשיטה

היה את הבעיה המוזרה, שם חתיכת Javascript עבד מצוין בכל עוז דפדפן כמו IE בר כרגיל :) פשוט ... זה היה, אבל מאז לא התסריט נכתב על ידי, לקח לי זמן לאתר באגים זה "האובייקט אינו תומך במאפיין זה או בשיטה" שגיאה רק IE היה להקיא. כנראה! אם הייתי צריך לכתוב את התסריט, לא הייתי צריך שגיאה זו כלל, לא הולכים ביחד שמות המשתנים שלי עם שדה זיהויי :).

בעיה: האובייקט אינו תומך במאפיין זה או בשיטה (בשורה 3)

 function funzoneSP(){ document.getElementById('video_id').style.visibility="hidden"; shortdesc = document.getElementById('shortdesc').value; .... } 

פתרון:
השגיאה נוצרת על thirdrow בדוגמה שלעיל (קו 3 ... "shortdesc = document.getE ...."). ניסיתי כל מיני שטויות, כי אני dont הוא אפילו שווה להזכיר כאן ולבסוף נחשו מה! רק שינוי var shortdesc למשהו אחר נפטר שגיאה. ביסודו של דבר! שם המשתנה חייב שונה fieldID


2010 28 דצמבר 2010

הצגת דף HTML סטטי אנדרואיד (Eclipse) אמולטור

כמה שעות ועכשיו אני כבר מסתכל על פתרונות להפעיל / לבדוק HTMLs סטטיים שלי אמולטור Eclipse / אנדרואיד. לא היה מוצלח לחלוטין עדיין .... למה אני מתכוון "לגמרי" הוא HTML מקבל טעון אישור אבל כל CSS ו-JS, כלומר את הביטוי החזותי לא ראיתי. במילים פיתוח, CSS אינו מוחל על הדף ...

חשבתי שזה יהיה למתחילים כמה עמיתים אנדרואיד מפתחים ממשק משתמש, אם ציינתי את קטע למטה כי השתמשתי כדי להציג את ה-HTML.

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

סליחה! אבל IM בהנחה שאתה יודע איך ליצור יישום סלולרי אנדרואיד ב Eclipse.

יצירה זו הפעילות שלך, זה יקרא "index.html" קובץ מנכסים הפרוייקט / תיקייה.

 public class Test extends Activity {  /** Called when the activity is first created. */  @Override  public void onCreate(Bundle savedInstanceState) {    super.onCreate(savedInstanceState);    WebView webview = new WebView(this);    setContentView(webview);    try {      InputStream fin = getAssets().open("index.html");        byte[] buffer = new byte[fin.available()];        fin.read(buffer);        fin.close();        webview.loadData(new String(buffer), "text/html", "UTF-8");    } catch (IOException e) {      e.printStackTrace();    }  } } 

2010 20 מאי 2010

Re-CSS אופניים: מבט על מסגרות-CSS

Re-אופניים הוא Buzzword ובפיתוח אינטרנט זה אומר לא שונה. זה חוסך אנרגיה, במונחים של מאמץ!

במהלך שנות כתיבת CSS ו-HTML ליצירת עיצובים, עקבתי מספר פעולות מומלצות, במרדף אחר חוסכת זמן ואנרגיה במה שאנחנו טווח בכינויו "גלגל מחדש להמציא". פעם אחר פעם, אמרתי לעצמי, שאני חייבת ליצור תבניות מספר, חלק ב-CSS בתקן מחדש שמיש כי אני אשתמש מחוץ לקופסה בעבודה העתיד שלי. אם כי לא לגמרי, אבל הצלחתי להשיג כמה מטרות.

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

אם כי ידוע על חיילים משוחררים, ניסיתי בעט כמה מושגי מפתח / שיטות עבודה מומלצות / מחשבות כי הושקעה ביצירת מסגרות, לעשות RE-CSS של רכיבה אפשרי. מקווה שזה יעזור כמה מפתחים-CSS אשר כבר עומד ולאחרונה עלו על העגלה CSS!

מפתחות מחדש אופניים של CSS:

השתמש מוסכמות למתן שמות

זה חייב להיות הגורם החשוב ביותר בקבלת CSS / HTML מחדש שמיש. מתן שמות עקבית רכיבי הדף מאפשר שימוש חוזר של רכיבי דף וסגנונות שלהם עם מעט או שינויים. בקנה אחד עם טענה זו, גם HTML5, בשינוי שינוי גדול על קודמותיה, היא להציג כמה דהינו תגיות מבנית. <article>, <section>, <header>, <aside>, ו <nav> [ מה HTML5 יביא? ]. גם ב-HTML 4 (או נמוך יותר), מומלץ לקרוא חלקים סטנדרטיים של הדף שלך consistanly כמו בדוגמה פשוטה מתחת ...

זכרו, רוב דפי הפרוייקט שלך, בסופו של דבר שיש אלמנטים מרכזיים אותם מבניים. זהה את הדפים האלה אלמנטים משותפים הליבה ....

  <div id="container">
    <div id="header"> ... </ p>
    <div id="nav"> ... </ p>
    <div id="sidebar"> ... </ p>
    <div id="footer"> ... </ p>
   </ P> 

איפוס סגנונות ברירת מחדל (CSS מאפס): בין אם אתה משתמש במסגרת או לכתוב בעצמך, עליך לספק CSS מאפס [ מה CSS מאפס? ], כפי שהם להפחית או לחסל לפעמים חוסר עקביות חזותיים המתרחשות בין דפדפנים שונים. במילים פשוטות מנגנון איפוס CSS מגדיר את הסגנונות של אלמנט HTML ערכי אפס או ריק, ובכך מבטל את כל ערכי ברירת המחדל של הדפדפן הם תנוחות. זה מספק שולחן נקי להגדיר את המאפיינים של חלל אלמנטים אלה של כל User-agent ברירות מחדל [ CSS2.1 סוכן המשתמש סגנון ברירת מחדל גיליון ]. כל המסגרות-CSS צריך מנגנון האיפוס. אם אתה כותב את עצמו CSS מאפס, מילת אזהרה היא שאם יקרה לך לשכוח לאפס נכס מפתח, זה יכול להוביל לדפדפנים נושאים, שקשה מאוד לאתר באגים. זכור, שמור עותק של סגנונות לאפס ולשחרר אותם כל פרויקט חדש שאתה יוצר.

  הגוף, div, dl, dt, dd, ul, ol, לי,
  H1, H2, H3, H4, H5, H6,
  מראש, טופס, fieldset, קלט, בחר, Textarea,
  עמ ', blockquote, שולחן, ה, TD
  {
    גבול: 0px;
    שולי: 0;
    padding: 0;
  } 

ברירות מחדל הגדר סגנונות (בסיסית) לגורמי:

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

רוב מסגרות CSS, תמיד מציג כמה ברירות מחדל חדשים, נוסף על איפוס דפדפן ברירת המחדל של סגנונות.
ברירות המחדל האלה הבטלות של User-agent ברירות מחדל (גנבו משם על ידי איפוס ה-CSS), אלה יהיו עקביים בין דפדפנים.

זכרו, סגנונות קו בסיס משמשים להגדיר סגנונות הולכים לשמש העיצוב כולו. למשל.

  html {font-size: 77%; font-family: Arial, sans-serif;}
 חזק, H1, H2, H3, H4, H5, H6 {font-weight: bold;} 

סגנונות מופשטים עבור רכיבי ה-HTML נפוצות וכיתות נפוצות:

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

מלבד הגדרת לשימוש חוזר הגדרות סגנונות עבור רכיבי ה-HTML משותפים, אנו מופשטים כיתות סגנונות יכול הקשורים לצבע הטיפוגרפיה, או אפילו פריסה. אני עצמי נוטה אתה משתמש ... כיתות נפוצות כמו Clearfix, Font08, FontGrey, AlignL, DisplayB וכו '

  קלט בצורה {גבול: 0px; הרקע: # FFFFFF; padding: 0px 10px; _padding: 0px 0px; גובה: 26px; color: # 000000; קו גובה: 30px; font-size: 1.1em;}
 טופס Textarea {גבול: 0px; הרקע: # FFFFFF; color: # 000000; font-size: .9 אותם, גובה קו: 1.5em; גלישה: גלוי;}
 . Fbold {font-weight: bold; color: # cccccc;}
 . Fgrey {color: # 666666;}
 . Flightgrey {color: # bbbbbb;}
 . Clearfix {ברור: הן;}
 . {מפריד הגבול העליון: 1px solid # 647B06, הגבול התחתון: מוצק 1px # 9CC00A גובה: 0px;}
 . Displayb {תצוגה: לחסום;}. Displayn {display: none;}
 . Alignr {text-align: right}. Alignc {text-align: מרכז}
 . Floatr {float: right;}. Floatl {float: שמאל;} 

תיקונים המוזרויות הדפדפן נפוצות

דפדפנים שונים ליישם קוד CSS ולספק רמה שונה של תמיכה במפרט CSS. התוצאה של זה .... "הדפדפן Quirks", שאנו מפתחים שנשארו להתמודד. במיוחד, IE6 רודף coders-CSS ביותר עם מועד לפגישה. החדשות הטובות הן ניסיון הביא יחד תיקונים אפשריים לשימוש חוזר לנושאים האלה (שמכונה לעתים קרובות כמו CSS Hacks ).

זכור, זכור את פריצות / תיקונים שימושי

  / * זום הבאות: 1 הכלל הוא במיוחד עבור IE6 + IE7.  * /
    * HTML. Clearfix,
    *:. ילד ראשון + HTML clearfix {
           זום: 1;
      } 

שמור על שיפור ה-CSS שלך

  • הרגל של רכיבה על אופניים מחדש לא בא אליך היום. זה חייב להתפתח. אז לתכנן מחדש של רכיבת אופניים. זכרו זאת, כי אתה יכול המחדל של סגנונות מופשטים, הגדרות טיפוגרפיה, פריסות, סגנונות אלמנט HTML וכו 'נסו לחשוב קדימה.
  • גם להביט אחורה על פרויקטים קודמים שלך, זה יעזור לזהות סגנונות אתם נוטים להשתמש לעתים קרובות על פני porjects. תקציר זה.
  • הסר את כל סגנונות שאינם בשימוש. נוהג זה ימשיך במסגרת CSS שלך סימפטום משותף בשם "נפיחות" -
  • הסר סגנונות החוזרות על עצמן.
  • לבנות קבוצה של סגנונות כי הם גמישים מספיק לנמל אותו על פני פרויקטים.

חפש ב-CSS מסגרות

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

  • 960 מערכת רשת : מערכת 960 גריד הוא מאמץ כדי לייעל את זרימת העבודה פיתוח באינטרנט על ידי מתן מידות נפוצות, בהתבסס על רוחב של 960 פיקסלים. קיימות שלוש גרסאות: 12, 16 ו -24 עמודים, אשר ניתן להשתמש בהם בנפרד או במקביל. לא חשבתי שאתה לא יכול ליצור דף כזה משלך די בקלות, במסגרת מספק תבניות רשת להדפסה בפורמט PDF, שניתן להשתמש בו כדי לשרטט designs.Bet הדף שלך, זה יעשה רושם מקצועי, אם אתה נושא כמה דפים כאשר אתה עובר ללקוח למפגש דרישות ממשק המשתמש. הוא גם מספק תבניות רשת בסיסיים תוכנות עיצוב פופולרי כמו זיקוקים, Flash, InDesign, Illustrator, Photoshop, Visio וכו 'מתן "המתנע של 10" כדי להתחיל לעבוד העיצוב שלך.
  • תכנית : תכנית אב מספקת המסווגים בבירור קבצי CSS עבור מאפס, רשתות, טפסים, הדפסה, טיפוגרפיה, כפתורים, תוספים עבור כרטיסיות שדונים וכו 'הוא גם מספק תמיכה עבור IE בתור נפרד כוללים.
  • SenCSs : שלא כמו 2 לעיל, SenCSs (Sense בולט), אין הגדרות CSS עבור פריסה. זה כולל גופנים, paddings, שוליים, טבלאות, רשימות, כותרות blockquotes, טפסים ועוד.
  • BlueTrip : הטענה המקורית שלו לתהילה היה זה, זה היה שילוב של התכונות הטובות ביותר שמספקת מסגרות אחרים אחרים כמו כחול, טיול הדפסה Oli ... מהמקום שבו היא מקבלת את שמה. ערכת תכונות של החברה כולל 24 עמודות הרשת, סגנונות טיפוגרפיה, סגנונות ORM, הדפסה, כפתורים וכו '
  • Yui רשתות : הביא לך רשת המפתחים של Yahooo, תומך נוזל רוחב (100%) פריסות, כמו גם מראש ברוחב קבוע פריסות ב 750px, 950px, 974px ו, ויכולת אישית בקלות לכל מספר. כפי שניתן לראות, מבחינה טכנית שלה רק את הפריסה של רכיבי. Yui גם סיפק HTML / CSS סטים של רכיבי דף אחרים
  • YAML (עוד פריסה Multicolumn)
  • Emastic

זכור, שימוש במסגרות-CSS אינה מעידה כי אתה עצלן כדי ליצור אחד משלך ... זה מרמז על כך שאתה חכם כדי ללמוד מהניסיון אחרים & טעויות, לחסוך זמן ולהגדיל את הפרודוקטיביות!!


2010 13 מרס 2010

@ Fontface: הבעת את זה עם גופן על פי בחירתך; שימוש WebFonts

CSS סיים 10 שנות קיומה השנה! מי בסביבה כבר זמן מה, להרוויח את לחמם (או לא) באמצעות CSS, אז אולי מודעים עד כמה היינו רעבים לבחירה טובה של גופנים. גם עם חוסר של גופנים מעצבים כמו אלה על גן זן CSS עשו שימוש בתמונות-CSS רקע להחליף גופנים במרדף אחר לעשות קצת צדק עם העיצובים שלהם. ניסינו גם פלאש / JavaScript ® פריצות להשיג מטרות העיצוב שלנו. בשום פנים ואופן לא זה הדרך הלא נכונה להשיג את הגופנים אנו חפצים לתוך עיצובים האינטרנט שלנו, אבל בהחלט, זה לא הדרך הרצויה ביותר. ושוב מעצב אינטרנט שנים, כמוני, יש לסמוך באופן מלא על עשרה בערך גופנים עבור העיצובים שלהם.

ההתפתחויות האחרונות בתקני אינטרנט ותבניות גופן מאפשרים להפוך טקסט ב-HTML הגופנים שאינם הגופנים אותם ברירת המחדל ישנים. מגיע "@ fontface" decleration CSS.

@ Fontface provids פתרון קישור לקובץ גופן בפועל לאחזר אותה מהאינטרנט. באמצעות @ fontface, מעצבי יכול להשתמש בגופנים מבלי להקפיא את הטקסט כתמונות רקע. היישום הוא מאוד ישר קדימה, כפי שנראה בהמשך, אך כמו כל הדברים הטובים יש חלק CON אליו, לא כל הדפדפנים תומכים "סוג הגופן" אחת. אם אתם מתכננים להשתמש fontface @ באתר עם ​​המחייב תמיכה דפדפנים, אז תצטרך לספק מקורות שונים למוצרי סוגי גופנים של אותו דבר.

  1. TrueType - פורמט שנועד להיראות טוב על המסך. מומלץ במיוחד עבור Windows דפדפנים (Chrome).
  2. OpenType (CFF) - פורמט זה הוא טוב יותר לעבודת ההדפסה לא תמיד נראה טוב ב-Windows.
  3. EOT - אתה צריך את זה בפורמט אם אתה רוצה למקד את Internet Explorer. IE לא להשתמש בכל תבנית אחרת. של EOT שלנו ייחשב "לייט", שכן הם דחוסים ולא תחום מוגבל.
  4. SVG - זה בפורמט XML נתמך על ידי מספר דפדפני כולל iPhone.
  5. WOFF - זה לדפדפנים, אינטרנט רק עיצוב הגופן הוא קל משקל (נתוני הגופן הוא דחוס), ואפשר גם עם הידור TrueType או PostScript (CFF) מתאר. היא נתמכת כיום על ידי פיירפוקס 3.6 +.

באמצעות @ fontface

  @ Font-הפנים {
 גופן משפחתי: "CalligraphyFLFRegular ';
 src: url ("CalligraphyFLF.eot ');
 src: מקומית ("CalligraphyFLF"), המקומית ("CalligraphyFLF '), בפורמט URL (" CalligraphyFLF.woff ") (" woff "), כתובת האתר (" CalligraphyFLF.ttf') בפורמט ("TrueType"), כתובת האתר ("CalligraphyFLF . SVG # CalligraphyFLF ') בפורמט ("SVG");
 }
 @ Font-הפנים {
   גופן משפחתי: "הגופן שלך";
   src: url ("גופנים / font_filename.eot");
   src: מקומית ("שם חלופי"), המקומית ("Alternatename"),
     ("גופנים / font_filename.woff") בפורמט URL ("woff"),
     ("גופנים / font_filename.otf") בפורמט URL ("OpenType"),
     ("גופנים / font_filename.svg # font_filename") בפורמט URL ("SVG");
   }
 h2 {font-family: "הגופן שלך", ג'ורג'יה, serif;} 

כפי שניתן לראות מהדוגמה לעיל, לכלול את הגופן גופן שנבחר, יש קישור לסדרה של fonttypes על גופן את אותו הדבר. ולכן אנשים מתייחסים אליו כאל "קיט גופן".
ישנן ערכות גופנים הזמינות במפורש מאפשר קישור עם נכס @ font-CSS הפנים לה על פי הסכם הרשיון למשתמש קצה (EULA).

WebFont משאבים שימושיים:

  • עבור @ גופן פנים הטבעת גופנים בדף ויקי ב http://webfonts.info/wiki/index.php?title=Main_Page
  • ריי Larabie . הוא מעצב בעל שם גופן שעשה מאות גופני TrueType מעניינים זמינים לשימוש חופשי באינטרנט. הגופנים שלו אלגנטי, דקורטיבי, ושובבה.
  • דיטר Steffmann עוד מעצב גופן גדול. גם הוא עשה גופנים יפים רבים זמינים לכל אחד להשתמש.
  • חנות גופן : מציעה גופנים שעוצבו במיוחד לשימוש באינטרנט. יותר מ 30 המשפחות FontFont המצליחים ביותר זמינה כעת FontFonts אינטרנט. FontShop גם WebFont מפורט הוראות שימוש http://www.fontshop.com/blog/newsletters/pdf/webfontfontuserguide.pdf
  • סנאי גופן : מציגה את כל הגופנים סנאי גופן מציע לשימוש עם הטבעה CSS @ font-הפנים. סנאי גופן מציע כמות מרשימה של סוג, עושה את זה פשוט מת לבחור אחד החוצה, בלי בעיות "מציע" - ערכות הגופנים על פי בחירתך, בפורמטים שונים, ארוזים עם הדגמה HTML & CSS המשתמשת הנוכחי מאוד @ font-הפנים בתחביר . הם גם מציעים דרך לגרום @ משלך גופן פנים ערכות . אם הגופן שבו ברצונך להשתמש כבר רישיון מתאים (אלה שמגיעים עם המחשב הם לא בהכרח בסדר), גנרטור מייצר EOT, SVG, ו - היי! קבצים WOFF.

2010 9 מרס 2010

שלו על "מעצבי אינטרנט שאינם יכולים קוד"

עם מוגבלות הגדרת המיומנות שלי עם כלים כמו Photoshop ו Illustrator, אני בכנות יכול להודות מפתח אני יותר טוב אני מעצב. אבל הרקע שלי עם הליבה (בצד השרת) עם פיתוח Java / PHP / COBOL, הייתה השפעה חיובית על מיומנויות פיתוח ממשק המשתמש שלי. כוונתי היא, תוך יצירת עיצובים שלי, כלומר בכל פעם שאני עושה עיצוב, אני חושב על איך העיצוב ניתן להמיר הטוב ביותר ל-HTML, CSS ותוך HTML-CSS, אני נותן מחשבה על הטכנולוגיה backend וודא סביר כי ה-HTML יכול להיות מיושם בקלות XSL לולאות או PHP קטעי וכו '

במשך שנים אני נזרק ראש על עיצובים של מעצבי ממשק משתמש שכנראה donot לי מושג מה ה-HTML או CSS הוא. כל השנים חשבתי שאני מבקש יותר מדי, אם אני רק מצפה מעצב, שמנסה shov "אי אפשר הקוד" שלו העיצוב לתוך הגרון שלי, כדי להבין קצת מה התכנון שלו היה להיות מומר אל. זה יכול לעזור נכון?

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

תודה אליוט מניות ג'יי ... אני מרגיש הקלה!

הנה כמה קטעים מן המאמר אליוט .

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

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

... אני צריך להיות קצת יותר ספציפי ב ציוץ שלי. אני מדבר על מעצבים שאין להם אפילו HTML בסיסי ביותר ומיומנויות-CSS להפוך עיצוב שטוח לתוך האתר עצמו. לא אנשים בכוונה בוחרים לא קוד, ומי לא. ואני גם מתכוון רק לקוד חזיתי כאן, כמובן שזה מגוחך לחשוב מעצבים צריכים גם להיות מדהים עורפיים מתכנתים ...

אנחנו מקבלים של אינטרנט של עיצובים שנשלחו Illustrator, 300dpi, אי אפשר קוד, אין עקביות / שימושיות.
~ איימי Mahon

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

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

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


2010 4 מרס 2010

לחצן הבחירה יישור עם טקסט

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

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


2010 8 ינואר 2010

מה HTML5 יביא?

HTML5 עדיין טיוטה. כשאני כותב, העבודה על HTML 5, שהחלה בשנת 2004, הוא עדיין נתון במצב של מאמץ משותף בין ה-HTML של W3C WG ואת WHATWG . המילה היא הדור הבא HTML יהיה שיפורים ותכונות, אשר היה מבנה חדש וסמנטיקה, בקרים, API, מולטימדיה וכו 'תגים.

באנגלית פשוטה ... מה זה אומר לנו, מפתחים ממשק משתמש ...

  • לא תהיה תוספת של דהינו בכמה תגי מבנית. <article>, <section>, <header>, <aside>, ו <nav>, אשר יחליף את מרבית <div> של שימוש בדף אינטרנט, מה שהופך את הדפים קצת יותר סמנטי, אבל חשוב יותר, קל יותר לקרוא.
    היי! תארו לעצמכם את המאמץ לשמור למצוא אחד חסר תג DIV סגור.
    למשל:
  <body>
   <header> ... </ כותרת>
   <nav> ... </ Nav>
   <article>
     <section>
       ...
     </ קטע>
   </ מאמר>
   <aside> ... </ בצד>
   <footer> ... </ תחתונה>
 </ Body> 

במקום

  <body>
   <div id="header"> ... </ p>
   <div id="nav"> ... </ p>
   <div class="article">
     <div class="section">
       ...
     </ P>
   </ P>
   <div id="aside"> ... </ p>
   <div id="footer"> ... </ p>
 </ Body> 
  • עם כניסתו של תוכן שמע ווידאו כמו YouTube, השימוש מולטימדיה משובצים בדף האינטרנט יש increaded על ידי קיפול. אם ניקח זאת בחשבון, עכשיו התוכנית היא להוסיף תמיכה מובנית הטבעה וידאו ושמע לתוך הדפדפן עצמו, ולכן מאפשר למשתמשים לשחק, להשהות, לעצור, לחפש, ולהתאים את עוצמת הקול באמצעות DOM builtin APIs עבור סקריפטים כדי לשלוט על ההשמעה.

למשל:

  <video poster="poster.jpg">
     <מקור src = "video.3gp" type = "video/3gpp"
     התקשורת = "כף יד">
         <source src="video.mp4" type="video/mp4">
 </ וידאו>
 <audio>
   <source src="music.oga" type="audio/ogg">
   <source src="music.mp3" type="audio/mpeg">
 </ אודיו> 
  • טוב מוגדרים תפקידים סמנטיים עבור אלמנטים הקיימים למשל. <strong> ו <em> אולי עכשיו באמת יש משמעויות שונות כלומר הם יתנהגו אחרת.

ישנם שינויים רבים יותר / שדרוגים לגרסה חדשה יותר ... אמשיך לעדכן את הפוסט כאשר אני בא accross כל אלה שימושיים מעניינים .... צפה בסרטון שטח

מסמך זה לא יכול לספק מידע מדויק מפרט ה-HTML 5 הוא עדיין פעיל בפיתוח. במקרה של ספק, תמיד לבדוק את מפרט ה-HTML 5 כאן .


2009 7 נובמבר 2009

CSS ZOOM - עוד תכונה מוזרה כלומר; SHIFT 3 פיקסל

פעם אחר פעם אחר פעם, כאשר כל הדפדפנים האחרים ראו להתנהג כפי שמספר אותו את כללי ה-W3C, ספירלות של IE אותך ברוח פיתוח על ידי זריקת התקף זעם, זה לא נראה שיש לתקן. רק אחד כזה הוא בעיה זו ב IE7.

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

ניתן פתרון:
מתוך ניסיון, יש לי אחוזים הודעה 90% כלומר פעמים, כי בעיה זו תוקנה על ידי הוספת נכס זום בהגדרת CSS של מיכל רע מתנהג ...

 # Somediv {
       זום: 1;
 }

שוב הסיבות משמעי ... תנסו את זה ...
כמה אלמנטים ב-IE יש "hasLayout" רכוש, שהיא "אמיתית" כברירת מחדל. הרבה התנהגויות חזותיים-CSS, למשל, המסנן אלפא עובד רק על אלמנט זה hasLayout. ו {זום: 1} נראה לתת את האלמנטים היעד נכס hasLayout .... שימושי? אני לא חושב כך ...

נכס זום הוא גם נראה נתמך על ידי Chrome, אבל בכח השימוש בו נראה לגרום השפעה שלילית רבה על הפריסה שלי ... לנסות את זה, אם זה עובד בשבילך ... אם לא, סימנייה לדף זה תחת "קוביות CSS"


2009 18 אוקטובר 2009

HTML & XHTML

  • הצהרת סוג המסמך צריך להיות נוכח בתחילת המסמך שמשתמש בתחביר HTML. זה אולי לחלופין לשמש בתוך תחביר XHTML, אבל זה לא נדרש. מסמך XHTML לא צריך לכלול את DOCTYPE כי המסמכים-XHTML, אשר נשלחו כראוי באמצעות XML סוג MIME ו מעובדים כמו XML בדפדפני, מוצגים תמיד במצב quirks לא.
  • ב-XHTML, שמות תגים הם במקרה רגיש מוגדרים בדרך כלל להיכתב באותיות קטנות. ב-HTML, לעומת זאת, שמות תגים הם במקרה רגיש ועלול להיות כתוב במקרה כולו באותיות גדולות או מעורבים, אם כי האמנה הנפוצה ביותר היא להישאר עם אותיות קטנות. במקרה של תגי ההתחלה והסיום לא צריך להיות זהה, אבל להיות עקביים עושה שואב מראה קוד.

יתרונות השימוש HTML

  • תואם לאחור עם הדפדפנים הקיימים
  • המחברים הם כבר מכירים את התחביר
  • תחביר מקלה וסלחנית אומר שלא תהיה למשתמש עוינת " מסך המוות הצהוב "אם הטעות בטעות מחליק דרך
  • תחביר קיצור נוח, מחברים למשל יכול להשמיט כמה התגים ואת ערכי תכונות

יתרונות השימוש ב-XHTML

  • קפדנית תחביר XML מעודד סופרים לכתוב סימון בנוי היטב, אשר מחברים מסוימים עשויים למצוא קל יותר לשמור על
  • משתלב ישירות עם אוצר מילים של XML אחרות, כגון SVG ו MathML
  • מאפשר שימוש ב-XML עיבוד, אשר חלק מחברי להשתמש במסגרת עריכת ו / או תהליכי הוצאה לאור

NDK הבית | הבעת IT | חך הבעת | Penmenship הבעת | הנוראים הבעת | לבטא את עצמי