diff --git a/README.md b/README.md
index 0c438602..08f4905d 100644
--- a/README.md
+++ b/README.md
@@ -47,6 +47,9 @@ Argon - 一个轻盈、简洁、美观的 WordPress 主题
 
 # 更新日志
 
+## 20191029 v0.57
++ 增加 题图(特色图片) 的支持
+
 ## 20191026 v0.56
 + 提升 Mathjax 版本到 3.0
 + 更换默认 Mathjax CDN
diff --git a/functions.php b/functions.php
index 6b95c118..bf06c743 100644
--- a/functions.php
+++ b/functions.php
@@ -4,6 +4,7 @@
 }
 function theme_slug_setup() {
    add_theme_support('title-tag');
+   add_theme_support('post-thumbnails');
 }
 add_action('after_setup_theme','theme_slug_setup');
 //检测更新
@@ -990,6 +991,16 @@ function themeoptions_page(){
 				字/分钟
 			</p>
 
+			<h2>文章头图 (特色图片)</h2>
+			<h4>阅读界面中文章头图的位置</h4>
+			<p>
+				<select name="argon_show_thumbnail_in_banner_in_content_page">
+					<?php $argon_show_thumbnail_in_banner_in_content_page = get_option('argon_show_thumbnail_in_banner_in_content_page'); ?>
+					<option value="false" <?php if ($argon_show_thumbnail_in_banner_in_content_page=='false'){echo 'selected';} ?>>文章卡片顶端</option>
+					<option value="true" <?php if ($argon_show_thumbnail_in_banner_in_content_page=='true'){echo 'selected';} ?>>Banner (顶部背景)</option>	
+				</select>
+			</p>
+
 			<h2>分享</h2>
 			<h4>显示文章分享按钮</h4>
 			<p>
@@ -1226,6 +1237,7 @@ function themeoptions_page(){
 	update_option('argon_enable_timezone_fix', $_POST['argon_enable_timezone_fix']);
 	update_option('argon_donate_qrcode_url', $_POST['argon_donate_qrcode_url']);
 	update_option('argon_hide_shortcode_in_preview', $_POST['argon_hide_shortcode_in_preview']);
+	update_option('argon_show_thumbnail_in_banner_in_content_page', $_POST['argon_show_thumbnail_in_banner_in_content_page']);
 	
 
 	//LazyLoad 相关
diff --git a/info.json b/info.json
index 3a24843b..00db7baf 100644
--- a/info.json
+++ b/info.json
@@ -1,5 +1,5 @@
 {
-  "version" : "0.56",
+  "version" : "0.57",
   "details_url" : "https://github.com/abc2237512422/argon-theme/releases",
-  "download_url" : "https://github.com/abc2237512422/argon-theme/releases/download/v0.56/argon.zip"
+  "download_url" : "https://github.com/abc2237512422/argon-theme/releases/download/v0.57/argon.zip"
 }
diff --git a/style.css b/style.css
index e241ade2..18f0de81 100644
--- a/style.css
+++ b/style.css
@@ -3,7 +3,7 @@ Theme Name: argon
 Author: abc2237512422
 Author URI: https://abc233.site/
 Description: 轻盈、简洁、美观的 Wordpress 主题
-Version: 0.56
+Version: 0.57
 License: MIT License
 License URI: https://opensource.org/licenses/MIT
 Tags: 简约, 两栏, 侧栏在左边, 浮动侧栏, 文章目录, 自适应, 夜间模式, 可自定义
@@ -654,6 +654,37 @@ html.darkmode #float_action_buttons #fab_toggle_darkmode:before{
 	margin-left: 2px;
 	margin-right: 2px;
 }
+.post-header.post-header-with-thumbnail {
+	margin: -30px -30px 35px -30px;
+	border-radius: .25rem .25rem 0 0;
+	overflow: hidden;
+	position: relative;
+}
+.post-thumbnail {
+	width: 100%;
+	min-height: 200px;
+	max-height: 25vh;
+	object-fit: cover;
+	pointer-events: none;
+}
+.single .post-thumbnail , .page .post-thumbnail {
+	max-height: 30vh;
+}
+.post-header.post-header-with-thumbnail .post-header-text-container {
+	position: absolute;
+	bottom: 0;
+	left: 0;
+	width: 100%;
+	color: #fff;
+	opacity: 0.9;
+	padding-bottom: 35px;
+	padding-top: 35px;
+	background: rgba(0,0,0,.05);
+	background: linear-gradient(to top, rgba(0,0,0,.3) 20%, rgba(0,0,0,0));
+}
+.post-header.post-header-with-thumbnail .post-header-text-container a {
+    color: #8f95ff !important;
+}
 .post-content{
 	line-height: 1.8;
 	margin-bottom: 10px;
diff --git a/template-parts/content-page.php b/template-parts/content-page.php
index d3ed7253..5853fb72 100644
--- a/template-parts/content-page.php
+++ b/template-parts/content-page.php
@@ -1,5 +1,21 @@
 <article class="post card bg-white shadow-sm border-0" id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
-	<header class="post-header text-center">
+	<header class="post-header text-center<?php if (has_post_thumbnail() && get_option('argon_show_thumbnail_in_banner_in_content_page') != 'true'){echo " post-header-with-thumbnail";}?>">
+		<?php
+			if (has_post_thumbnail() && get_option('argon_show_thumbnail_in_banner_in_content_page') != 'true'){
+				$thumbnail_url = wp_get_attachment_image_src(get_post_thumbnail_id($post->ID), full)[0];
+				echo "<img class='post-thumbnail' src='" . $thumbnail_url . "'></img>";
+				echo "<div class='post-header-text-container'>";
+			}
+			if (has_post_thumbnail() && get_option('argon_show_thumbnail_in_banner_in_content_page') == 'true'){
+				$thumbnail_url = wp_get_attachment_image_src(get_post_thumbnail_id($post->ID), full)[0];
+				echo "
+				<style>
+					body section.banner {
+						background-image: url(" . $thumbnail_url . ") !important;
+					}
+				</style>";
+			}
+		?>
 		<a class="post-title" href="<?php the_permalink(); ?>"><?php the_title(); ?></a>
 		<div class="post-meta">
 			<?php if ( is_sticky() && is_home() && ! is_paged() ) : ?>
@@ -64,6 +80,11 @@
 				</div>
 			<?php } ?>
 		</div>
+		<?php
+			if (has_post_thumbnail() && get_option('argon_show_thumbnail_in_banner_in_content_page') != 'true'){
+				echo "</div>";
+			}
+		?>
 	</header>
 
 	<div class="post-content" id="post_content">
diff --git a/template-parts/content-single.php b/template-parts/content-single.php
index fadc03d7..13aebf7f 100644
--- a/template-parts/content-single.php
+++ b/template-parts/content-single.php
@@ -1,5 +1,21 @@
 <article class="post card bg-white shadow-sm border-0" id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
-	<header class="post-header text-center">
+	<header class="post-header text-center<?php if (has_post_thumbnail() && get_option('argon_show_thumbnail_in_banner_in_content_page') != 'true'){echo " post-header-with-thumbnail";}?>">
+		<?php
+			if (has_post_thumbnail() && get_option('argon_show_thumbnail_in_banner_in_content_page') != 'true'){
+				$thumbnail_url = wp_get_attachment_image_src(get_post_thumbnail_id($post->ID), full)[0];
+				echo "<img class='post-thumbnail' src='" . $thumbnail_url . "'></img>";
+				echo "<div class='post-header-text-container'>";
+			}
+			if (has_post_thumbnail() && get_option('argon_show_thumbnail_in_banner_in_content_page') == 'true'){
+				$thumbnail_url = wp_get_attachment_image_src(get_post_thumbnail_id($post->ID), full)[0];
+				echo "
+				<style>
+					body section.banner {
+						background-image: url(" . $thumbnail_url . ") !important;
+					}
+				</style>";
+			}
+		?>
 		<a class="post-title" href="<?php the_permalink(); ?>"><?php the_title(); ?></a>
 		<div class="post-meta">
 			<?php if ( is_sticky() && is_home() && ! is_paged() ) : ?>
@@ -62,6 +78,11 @@
 				</div>
 			<?php } ?>
 		</div>
+		<?php
+			if (has_post_thumbnail() && get_option('argon_show_thumbnail_in_banner_in_content_page') != 'true'){
+				echo "</div>";
+			}
+		?>
 	</header>
 
 	<div class="post-content" id="post_content">
diff --git a/template-parts/content.php b/template-parts/content.php
index 427e325b..b2caf6f2 100644
--- a/template-parts/content.php
+++ b/template-parts/content.php
@@ -1,5 +1,12 @@
 <article class="post card bg-white shadow-sm border-0" id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
-	<header class="post-header text-center">
+	<header class="post-header text-center<?php if (has_post_thumbnail()){echo " post-header-with-thumbnail";}?>">
+		<?php
+			if (has_post_thumbnail()){
+				$thumbnail_url = wp_get_attachment_image_src(get_post_thumbnail_id($post->ID), full)[0];
+				echo "<img class='post-thumbnail' src='" . $thumbnail_url . "'></img>";
+				echo "<div class='post-header-text-container'>";
+			}
+		?>
 		<a class="post-title" href="<?php the_permalink(); ?>"><?php the_title(); ?></a>
 		<div class="post-meta">
 			<?php if ( is_sticky() && is_home() && ! is_paged() ) : ?>
@@ -62,6 +69,11 @@
 				</div>
 			<?php } ?>
 		</div>
+		<?php
+			if (has_post_thumbnail()){
+				echo "</div>";
+			}
+		?>
 	</header>
 
 	<div class="post-content">