本课示范了在wordpress主题制作过程中如何实现特色图像的支持，并且如何让特色图像实现响应式，以下是笔记和部分源码。
1、wordpress免插件自动为文章添加设置特色图像的三种方法
（http://www.511yj.com/wordpress-featured-image.html ）
/*
*增加特色图像
*/
if ( function_exists( 'add_theme_support' ) ) { // Added in 2.9
add_theme_support( 'post-thumbnails' );
//add_image_size('pop-thumb',542,340,true );
// Permalink thumbnail size
}
2、前台调用
PHP if (has_post_thumbnail()) : ?>
PHP the_permalink() ?>" title="PHP the_title_attribute() ?>">PHP the_post_thumbnail('pop-thumb'); ?>
PHP endif; ?>
优酷土豆链接：优酷土豆视频高清观看
优酷全部教程播单：http://i.youku.com/i/UNTU3NDYyODg0/playlists
wordpress主题制作综合教程：http://list.youku.com/albumlist/show/id_49481719
交流群：521068947
本人QQ: 272586593
3、style.css
/*-------------------------------------------------------------
---------------------------------------------------------------*/
.featured-thumb {
border-top: #ccc solid 3px;
overflow: hidden;
transition: 0.5s all ease;
-webkit-transition: 0.5s all ease;
-moz-transition: 0.5s all ease;
-ms-transition: 0.5s all ease;
-o-transition: 0.5s all ease;
padding:0;
}
4、js控制响应式缩放图片
jQuery(function($){
$('.featured-thumb img').addClass('img-responsive');
});