December 2013
Intermediate to advanced
752 pages
16h
Chinese
Content preview from MOBILE WEB程式設計--第二版
Become an O’Reilly member and get unlimited access to this title plus top books and audiobooks from O’Reilly and nearly 200 top publishers, thousands of courses curated by job role, 150+ live events each month,
O’Reilly covers everything we've got, with content to help us build a world-class technology community, upgrade the capabilities and competencies of our teams, and improve overall team performance as well as their engagement.I wanted to learn C and C++, but it didn't click for me until I picked up an O'Reilly book. When I went on the O’Reilly platform, I was astonished to find all the books there, plus live events and sandboxes so you could play around with the technology.I’ve been on the O’Reilly platform for more than eight years. I use a couple of learning platforms, but I'm on O'Reilly more than anybody else. When you're there, you start learning. I'm never disappointed.I'm always learning. So when I got on to O'Reilly, I was like a kid in a candy store. There are playlists. There are answers. There's on-demand training. It's worth its weight in gold, in terms of what it allows me to do.
圖像與媒體
|
331
Picture 圖片元素
在使用 CSS 媒體查詢或圖像集時，最主要的問題是我們一直討論的 CSS 背景圖像。
從 HTML 的角度來看，唯一的方式是加入 JavaScript 程式碼。認識到這一點之後，
W3C 已經啟動一個新的討論群組—Responsive Images Community Group（
http://bit.ly/
ZPtuAL
）—其目標是為未來的 HTML5 創建一個新的元素：
picture
元素。
picture
元素使用媒體查詢與圖像集技術來進行繪製，但是從 HTML 的觀點來看，它將
會取代
img
元素。在寫這本書時，還沒有瀏覽器支援這個新元素，但某些瀏覽器可能很
快就會開始支援。
Scott Jehl（
http://scottjehl.com
）為
picture
元素製作一個開源 polyfill，它
經過 HTML5 的驗證，以非常類似 W3C 提案的
picture
元素的語法來使用
div
。你可以在 Scott Jehl 的 GitHub 找到它（
https://github.com/scottjehl/
picturefill
）。
picture
元素可以使用不同的
source
元素，藉由定義不同的
media
屬性與一個
src
或
srcset
定義式（遵循圖像集語法）來提供不同的圖像。我們來看一個範例：
<picture width="500" height="500">
<source media="(min-width: 50em)" src="large.jpg" ...
Become an O’Reilly member and get unlimited access to this title plus top books and audiobooks from O’Reilly and nearly 200 top publishers, thousands of courses curated by job role, 150+ live events each month,
and much more.
Read now
Unlock full access
More than 5,000 organizations count on O’Reilly
O’Reilly covers everything we've got, with content to help us build a world-class technology community, upgrade the capabilities and competencies of our teams, and improve overall team performance as well as their engagement.Julian F.
I wanted to learn C and C++, but it didn't click for me until I picked up an O'Reilly book. When I went on the O’Reilly platform, I was astonished to find all the books there, plus live events and sandboxes so you could play around with the technology.Addison B.
I’ve been on the O’Reilly platform for more than eight years. I use a couple of learning platforms, but I'm on O'Reilly more than anybody else. When you're there, you start learning. I'm never disappointed.Amir M.
I'm always learning. So when I got on to O'Reilly, I was like a kid in a candy store. There are playlists. There are answers. There's on-demand training. It's worth its weight in gold, in terms of what it allows me to do.