Drupal: ไม่มี CSS3 ใดที่ใช้งานไม่ได้กับ IE ใช่ไหม เว็บฟอนต์ของ Google โดยเฉพาะ รหัสนี้ถูกต้องไหม?

ขณะนี้ฉันกำลังทำงานกับ www.liganet.net และดูเหมือนว่าจะใช้ได้ใน Chrome และ Firefox แต่ลองดูด้วย Internet Explorer เวอร์ชันใดก็ได้... มุมโค้งมนหายไป ทุกอย่างดูแย่ โดยเฉพาะ Google Webfonts ฉันได้ติดตั้งโมดูล Drupal "Google Fonts" เพื่อให้ฉันสามารถใช้แบบอักษร Google ได้ง่ายขึ้น แต่ฉันคิดว่าปัญหาไม่เกี่ยวข้องกับ Drupal

นี่คือโค้ดที่ควรแสดงชื่อหน้าด้วยรูปแบบ webfonts:

.logo-1 {font-family:delius; font-size:18pt; margin-top:-35px;}
.logo-2 {font-family:chewy; font-size:44pt; margin-top:-25px; color:#133793;}
.logo-3 {font-family:delius; font-size:19pt; margin-top:-26px; text-align:right;}

ดังนั้นลิงก์ทั้งสามนี้ควรกำหนดลักษณะการแสดงชื่อ IE จะไม่แสดงฟอนต์ของ Google

และนี่คือเส้นขอบโค้งมน เงา และริบบิ้นที่ไม่ปรากฏเลย!

border: 1px solid #6487DC;
*border-top: 1px solid #6487DC;
*border-bottom: 1px solid #6487DC;
-moz-border-radius: 10px 10px 10px 10px; /* FF1+ */
-webkit-border-radius: 10px 10px 10px 10px; /* Saf3+, Chrome */
border-radius: 10px 10px 10px 10px; /* Opera 10.5, IE 9 */


-moz-box-shadow:2px 2px 0 rgba(0,0,0,0.1);
-webkit-box-shadow:2px 2px 0 rgba(0,0,0,0.1);
-o-box-shadow:2px 2px 0 rgba(0,0,0,0.1);
box-shadow:2px 2px 0 rgba(0,0,0,0.1);

ฉันได้ ตรวจสอบแล้ว ว่าโค้ดทั้งหมดนั้นควรจะใช้งานได้ใน IE บางทีฉันอาจจะลืมอะไรบางอย่างไปหรือเปล่า ฉันขอขอบคุณความช่วยเหลือหรือคำแนะนำเกี่ยวกับเรื่องนี้จริงๆ ขอบคุณ! โรซามันดา

อัปเดต:

ขอบคุณสำหรับคำตอบ! ฉันพยายามทำความเข้าใจข้อผิดพลาด โดยเฉพาะข้อผิดพลาดที่เกี่ยวข้องกับเว็บฟอนต์ ไซต์ที่คุณกรุณาบอกฉันว่า http://jigsaw.w3.org บอกฉันว่าโค้ดควร พูด:

@font-face {
font-family : "'Abel'";
font-style : normal;
font-weight : normal;
src : local('Abel'), local('Abel-Regular'), url('http://themes.googleusercontent.com/static/fonts/abel/v1/N59kklKPso9WzbZH9jwJSg.ttf') format('truetype');
}

แต่หลังจากเปลี่ยนสิ่งนั้นในไฟล์ .css ของฉัน มันก็ใช้งานไม่ได้ ข้อผิดพลาดจำนวนมากเป็นของโมดูล Drupal ซึ่งทำงานได้ดี และข้อผิดพลาดที่เกี่ยวข้องกับ webfonts ควรได้รับการแก้ไขโดยเพิ่มบรรทัดเหล่านั้นลงในไฟล์

แต่มันจะไม่ทำงาน...


person Rosamunda    schedule 12.08.2011    source แหล่งที่มา
comment
คุณมีข้อผิดพลาด css อยู่บ้าง (ไม่ต้องพูดถึงข้อผิดพลาด HTML เล็กน้อย) ที่ควรค่าแก่การตรวจสอบและแก้ไข ข้อผิดพลาด CSS 41 รายการ - เครื่องมือตรวจสอบ CSS W3C   -  person Sam Martin    schedule 13.08.2011


คำตอบ (1)


หลังจากลองผิดลองถูกมาหลายครั้ง ฉันพบ (ค่อนข้างประหลาดใจมาก) ว่าปัญหาอยู่ที่โมดูล Google Fonts เอง ใช่. ฉันได้ถอนการติดตั้งแล้ว และไปที่ http://www.google.com/webfonts เลือก แบบอักษรที่ฉันต้องการใช้และคัดลอก/วางโค้ดบรรทัดเดียวที่ Google ให้ฉันอย่างรวดเร็ว FYI มันคือบรรทัดนี้:

<link href='http://fonts.googleapis.com/css?family=Abel|Delius|Chewy|Rokkitt:400,700|Coustard' rel='stylesheet' type='text/css'>

ฉันใส่มันไว้ใน <head> ของ page.tpl.php แล้วไงล่ะ! ไม่ใช่แค่แบบอักษรเท่านั้น แต่ทุกอย่างยังใช้งานได้ (ส่วน CSS3 อื่น ๆ ที่ดูแย่มากจนถึงตอนนี้ :)

อย่างไรก็ตาม ฉันแค่อยากจะโพสต์วิธีแก้ปัญหา เผื่อมีใครเจอปัญหานี้

person Rosamunda    schedule 13.08.2011