{"id":25973,"date":"2020-04-03T02:48:42","date_gmt":"2020-04-02T18:48:42","guid":{"rendered":"https:\/\/facekungfu.com\/rwd-concept-and-solutions-of-sliders-on-mobile\/"},"modified":"2023-11-28T03:04:32","modified_gmt":"2023-11-27T19:04:32","slug":"rwd-concept-and-solutions-of-sliders-on-mobile","status":"publish","type":"post","link":"https:\/\/ke2b.com\/zh-hant\/rwd-concept-and-solutions-of-sliders-on-mobile\/","title":{"rendered":"Sliders, Hero images \u5728\u624b\u6a5f \/ \u884c\u52d5\u88dd\u7f6e\u4e0a\u986f\u793a\u7684 RWD \u6982\u5ff5\u8207\u4f5c\u6cd5"},"content":{"rendered":"\n

WordPress \u793e\u5718\u767c\u554f\u5167\u5bb9<\/h2>\n\n\n\n
\n

\u60a8\u597d\uff0c\u6211\u60f3\u8acb\u6559\u4e00\u4e0b~ \u4f7f\u7528\u5e7b\u71c8\u7247\u79c0\uff08Sliders\uff09 \u5982\u4f55\u8b93\u7167\u7247\u5728\u624b\u6a5f\u88e1\u5169\u908a\u4e0d\u6703\u88ab\u5207\u5230\uff0c\u5728\u96fb\u8166\u7248\u662f\u5168\u5c4f\u5e55\u986f\u793a\uff0c\u4f46\u624b\u6a5f\u5c31\u6703\u5207\u5230\u3002\u8b1d\u8b1d~~<\/p>\n<\/blockquote>\n\n\n\n

\u662f\u6307\u5716\u9ad8\u6c92\u8b8a\uff0c\u5716\u5bec\u5169\u908a\u7684\u5167\u5bb9\u7e2e\u6e1b\u7684\u72c0\u6cc1\uff1f<\/p>\n\n\n\n

\n

\u5c0d,\u60f3\u8b93\u6574\u5f35\u5716\u5728\u624b\u6a5f\u5167\u90fd\u986f\u793a\u51fa, \u5716\u9ad8\u8b8a\u5c0f\u5bec\u5ea6\u53ef\u4ee5\u7b26\u5408\u624b\u6a5f\u5bec\u5ea6<\/p>\n<\/blockquote>\n\n\n\n

\u89e3\u7b54\u5354\u52a9<\/h2>\n\n\n\n

Slider \u7684\u8de8\u88dd\u7f6e\u7db2\u9801\u524d\u7aef\u8a2d\u8a08\u8655\u7406<\/h3>\n\n\n\n

\u4ee5\u4e0b\u4e0d\u6703\u662f\u300c\u7d66\u6211\u6211\u8981\u7684\u300d\u7684\u56de\u7b54\uff0c\u4f46\u6703\u628a\u985e\u4f3c\u9019\u6a23 Sliders On Mobile \u7684\u5404\u7a2e\u53ef\u80fd\u60f3\u8981\u4f46\u4e0d\u4e00\u5b9a\u6703\u6bd4\u8f03\u597d\u7684\u9700\u6c42\u3001\u4f5c\u6cd5\u5305\u542b\u5728\u5167\u3002<\/p>\n\n\n\n

Slider \u5728\u8de8\u88dd\u7f6e\u7684\u8655\u7406\uff0c\u5f88\u65e9\u671f\u958b\u59cb\u5404\u5bb6\u8f03\u8b1b\u7a76\u7684\u4f48\u666f\u4e3b\u984c\u958b\u767c\u5718\u968a\u5c31\u5e38\u88ab\u554f\u4e86(\u5f8c\u4f86\u662f\u56de\u5230\u7169\uff0c\u4e7e\u8106\u591a\u5f04\u51fa\u6b04\u4f4d\u4efb\u4eba\u6539\u7b97\u4e86)\uff0c\u4e14\u6703\u5e36\u5230\u9019\u6982\u5ff5\uff0c\u6211\u89ba\u5f97\u9019\u6982\u5ff5\u5f88\u91cd\u8981\uff0c\u53ef\u53c3\u8003\uff1ahttps:\/\/bridge.qodeinteractive.com\/documentation\/8-qode-slider\/8-7-tips-and-tricks\/8-7-1-choosing-appropriate-image-sizes\/<\/a><\/p>\n\n\n\n

\u7c21\u55ae\u5716\u89e3<\/h3>\n\n\n\n
\"Responsive
Responsive sliders explains via Bridge<\/figcaption><\/figure>\n\n\n\n
\"Responsive
Responsive sliders explains – Tablet example via Bridge<\/figcaption><\/figure>\n\n\n\n

\u4e00\u5f35\u5716\u8b1b\u5b8c\u9019\u500b\uff0c\u6bd4\u5404\u7a2e\u5fc5\u5b9a\u5b58\u5728\u7684\u9700\u6c42\u7591\u554f\u8207\u89e3\u6cd5\u9084\u91cd\u8981\u7684\u6982\u5ff5\uff0c\u53ea\u5dee\u4ee5\u524d\u770b\u904e\u52a0\u5283\u7dda\u3001\u52a0\u8a3b\u5716\u89e3\u66f4\u6e05\u695a\u50b3\u9054\u7684\u8aaa\u660e\uff0c\u4e00\u6642\u61f6\u5f97\u82b1\u592a\u591a\u6642\u9593\u7ffbXD<\/p>\n\n\n\n

\u8de8\u88dd\u7f6e\u5716\u793a\u5c0d\u7167\uff0c\u8acb\u898b\u6587\u7ae0\u88e1\u7684 8.6.4.4 (\u9019\u88e1\u9644 8.6.3 \u7684\u9023\u7d50\u662f\u56e0\u70ba\u4ed6\u5011 8.6.4 \u7684\u5167\u5bb9\u76ee\u9304\u9023\u7d50\u6709\u554f\u984c)\uff1ahttps:\/\/bridge.qodeinteractive.com\/documentation\/8-qode-slider\/8-6-using-the-slider\/8-6-3-basic-usage\/<\/a><\/p>\n\n\n\n

Slider \u7684\u8de8\u88dd\u7f6e\u8655\u7406\u7bc4\u4f8b 1.<\/h3>\n\n\n\n
\"Responsive
Responsive sliders explains-Cross-devices example 1 via Bridge<\/figcaption><\/figure>\n\n\n\n

Slider \u7684\u8de8\u88dd\u7f6e\u8655\u7406\u7bc4\u4f8b 2.<\/h3>\n\n\n\n
\"Responsive
Responsive sliders explains-Cross-devices example 2 via Bridge<\/figcaption><\/figure>\n\n\n\n

\u8acb\u7559\u610f\u6b63\u898f\u7684\u524d\u7aef\u8a2d\u8a08\u8003\u91cf<\/h2>\n\n\n\n

\u5305\u542b Slider \u5143\u7d20\u7b49\u5404\u7a2e\u8003\u91cf RWD \u7684\u8a2d\u8a08\uff0c\u6709\u7167\u6b63\u898f\u898f\u5283\u7684\u8a2d\u8a08\uff0c\u90fd\u6709\u5176\u7d9c\u5408\u8003\u91cf\u5728\uff0c\u53ef\u4ee5\u8d81\u6709\u9700\u6c42\u60f3\u6539\u6771\u897f\u6642\u9806\u4fbf\u4e86\u89e3\uff0c\u6709\u52a9\u65bc\u505a\u51fa\u9577\u671f\u597d\u7528\u53c8\u5468\u5ef6\u7684\u8abf\u6574\u6c7a\u7b56\u3002<\/p>\n\n\n\n

P.S. Bridge \u70ba\u539f\u6587\u76f4\u63a5\u53d6\u6750\u8207\u7bc4\u4f8b\u5c55\u793a\u4e4b\u7528\uff0c\u7686\u975e\u672c\u5de5\u4f5c\u5ba4\u4e3b\u8981\u88fd\u4f5c\u5de5\u5177\/\u8cc7\u6e90\uff0c\u4e0d\u904e\u80cc\u5f8c\u7684\u539f\u7406\u90fd\u662f\u985e\u4f3c\u7684\u901a\u5247\uff0c\u5927\u5bb6\u4e5f\u5225\u88ab\u81ea\u5df1\u624b\u908a\u4f7f\u7528\u7684\u5de5\u5177\/\u8cc7\u6e90\u7d66\u9650\u5236\u4f4f\u4e86\u3002<\/p>\n","protected":false},"excerpt":{"rendered":"

Sliders, Hero images \u5728\u8de8\u88dd\u7f6e\u7684\u8655\u7406\uff0c\u5f88\u65e9\u671f\u958b\u59cb\u5404\u5bb6\u8f03\u8b1b\u7a76\u7684\u4f48\u666f\u4e3b\u984c\u958b\u767c\u5718\u968a\u5c31\u5e38\u88ab\u554f\u4e86(\u5f8c\u4f86\u662f\u56de\u5230\u7169\uff0c\u4e7e\u8106\u591a\u5f04\u51fa\u6b04\u4f4d\u4efb\u4eba\u6539\u7b97\u4e86)\uff0c\u4e14\u6703\u5e36\u5230\u9019\u6982\u5ff5\uff0c\u6211\u89ba\u5f97\u9019\u6982\u5ff5\u5f88\u91cd\u8981<\/p>\n","protected":false},"author":1,"featured_media":25805,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"_seopress_robots_primary_cat":"none","_seopress_titles_title":"","_seopress_titles_desc":"","_seopress_robots_index":"","_seopress_analysis_target_kw":"WordPress,Slider,Bridge,Theme,\u7db2\u9801\u8a2d\u8a08,\u6a6b\u5e45,Banner,\u4f48\u666f\u4e3b\u984c,\u8de8\u88dd\u7f6e,\u884c\u52d5\u88dd\u7f6e,\u524d\u7aef\u8a2d\u8a08,RWD,Mobile,Web Design","_jetpack_feature_clip_id":0,"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[107,113,1,114],"tags":[128,135],"class_list":["post-25973","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-wordpress-zh-hant","category-qa-zh-hant","category-uncategorized-zh-hant","category-web-design-zh-hant","tag-rwd-zh-hant","tag-wordpress-zh-hant"],"blocksy_meta":{"styles_descriptor":{"styles":{"desktop":"","tablet":"","mobile":""},"google_fonts":[],"version":6}},"acf":[],"jetpack_featured_media_url":"https:\/\/i0.wp.com\/ke2b.com\/wp-content\/uploads\/2020\/05\/Responsive-sliders-explains-Cross-devices-example-1-via-Bridge.jpg?fit=1020%2C478&quality=89&ssl=1","jetpack_likes_enabled":true,"jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/ke2b.com\/zh-hant\/wp-json\/wp\/v2\/posts\/25973","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ke2b.com\/zh-hant\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/ke2b.com\/zh-hant\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/ke2b.com\/zh-hant\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/ke2b.com\/zh-hant\/wp-json\/wp\/v2\/comments?post=25973"}],"version-history":[{"count":0,"href":"https:\/\/ke2b.com\/zh-hant\/wp-json\/wp\/v2\/posts\/25973\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/ke2b.com\/zh-hant\/wp-json\/wp\/v2\/media\/25805"}],"wp:attachment":[{"href":"https:\/\/ke2b.com\/zh-hant\/wp-json\/wp\/v2\/media?parent=25973"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/ke2b.com\/zh-hant\/wp-json\/wp\/v2\/categories?post=25973"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/ke2b.com\/zh-hant\/wp-json\/wp\/v2\/tags?post=25973"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}