{"id":1980,"date":"2023-03-25T14:33:59","date_gmt":"2023-03-25T06:33:59","guid":{"rendered":""},"modified":"2023-03-25T14:33:59","modified_gmt":"2023-03-25T06:33:59","slug":"Bootstrap Jumbotron","status":"publish","type":"post","link":"https:\/\/bianchenghao6.com\/1980.html","title":{"rendered":"Bootstrap Jumbotron"},"content":{"rendered":"


\n <\/head>
\n <\/p>\n

\n

Bootstrap Jumbotron<\/h1>\n<\/p><\/div>\n

Bootstrap Jumbotron <\/h2>\n
\n Bootstrap jumbotron\u6307\u5b9a\u4e00\u4e2a\u5927\u76d2\u5b50\uff0c\u4ee5\u5f15\u8d77\u5bf9\u67d0\u4e9b\u7279\u6b8a\u5185\u5bb9\u6216\u4fe1\u606f\u7684\u989d\u5916\u5173\u6ce8\u3002\u5b83\u663e\u793a\u4e3a\u5e26\u6709\u5706\u89d2\u7684\u7070\u8272\u6846\u3002\u5b83\u8fd8\u53ef\u4ee5\u653e\u5927\u5176\u4e2d\u7684\u6587\u672c\u7684\u5b57\u4f53\u5927\u5c0f\u3002\n <\/div>\n
\n \u60a8\u53ef\u4ee5\u5c06\u4efb\u4f55\u6709\u6548\u7684HTML\u6216\u5176\u4ed6Bootstrap\u5143\u7d20\/\u7c7b\u653e\u7f6e\u5728\u5de8\u578b\u98de\u8f6e\u4e2d\u3002\n <\/div>\n
\n class.jumbotron \u5143\u7d20\u4e2d\u7684\u7528\u4e8e\u521b\u5efa\u8d85\u5927\u52a0\u901f\u5668\u3002\n <\/div>\n
\n

Jumbotron\u5185\u90e8\u5bb9\u5668<\/h3>\n
\n \u5982\u679c\u60a8\u4e0d\u5e0c\u671bJumbotron\u5ef6\u4f38\u5230\u5c4f\u5e55\u8fb9\u7f18\uff0c\u5219\u5728Jumbotron\u4e2d\u4f7f\u7528Inside\u5bb9\u5668\u3002\n <\/div>\n
\n \u5c06\u5e9e\u7136\u5927\u7269\u653e\u5165\u5185\u90e8\u3002\n <\/div>\n
\n \u793a\u4f8b:\n <\/div>\n
\n
<!DOCTYPE html>\r\n<html lang=\"en\"<\/span>>\r\n<head>\r\n  <title>Bootstrap Example<\/title>\r\n  <meta charset=\"utf-8\"<\/span>>\r\n  <meta name=\"viewport\"<\/span> content=\"width=device-width, initial-scale=1\"<\/span>>\r\n  <link rel=\"stylesheet\"<\/span> href=\"https:\/\/maxcdn.bootstrapcdn.com\/bootstrap\/3.3.6\/css\/bootstrap.min.css\"<\/span>>\r\n<\/head>\r\n<body>\r\n<div class=\"container\"<\/span>>\r\n  <div class=\"jumbotron\"<\/span>>\r\n    <h1>this<\/span> is Jumbotron inside container!<\/h1>      \r\n    <p>Jumbotron specifies a big box for <\/span>getting extra attention to some special content or information.<\/p>\r\n  <\/div>\r\n  <p>this<\/span> is some text.<\/p>      \r\n  <p>this<\/span> is another text.<\/p>      \r\n<\/div>\r\n  <script src=\"https:\/\/ajax.googleapis.com\/ajax\/libs\/jquery\/1.12.0\/jquery.min.js\"<\/span>><\/script>\r\n  <script src=\"https:\/\/maxcdn.bootstrapcdn.com\/bootstrap\/3.3.6\/js\/bootstrap.min.js\"<\/span>><\/script>\r\n<\/body>\r\n<\/html><\/pre>\n
<\/code>\n  <\/div>\n
\n
Jumbotron\u5916\u90e8\u5bb9\u5668<\/h3>\n
\n    \u5f53\u60a8\u5e0c\u671bJumbotron\u6269\u5c55\u5230\u5c4f\u5e55\u8fb9\u7f18\u65f6\uff0c\u53ef\u4ee5\u4f7f\u7528\u5b83\u3002\n  <\/div>\n
\n    \u5c06\u5e9e\u7136\u5927\u7269\u653e\u5728\n  <\/div>\n
\n    \u793a\u4f8b:\n  <\/div>\n
\n
<!DOCTYPE html>\r\n<html lang=\"en\"<\/span>>\r\n<head>\r\n  <title>Bootstrap Example<\/title>\r\n  <meta charset=\"utf-8\"<\/span>>\r\n  <meta name=\"viewport\"<\/span> content=\"width=device-width, initial-scale=1\"<\/span>>\r\n  <link rel=\"stylesheet\"<\/span> href=\"https:\/\/maxcdn.bootstrapcdn.com\/bootstrap\/3.3.6\/css\/bootstrap.min.css\"<\/span>>\r\n<\/head>\r\n<body>\r\n<div class=\"jumbotron\"<\/span>>\r\n  <h1>this<\/span> is Jumbotron outside container!<\/h1>      \r\n  <p>Jumbotron specifies a big box for <\/span>getting extra attention to some special content or information.<\/p>\r\n<\/div>\r\n<div class=\"container\"<\/span>>\r\n  <p>this<\/span> is some text.<\/p>      \r\n  <p>this<\/span> is another text.<\/p>      \r\n<\/div>\r\n  <script src=\"https:\/\/ajax.googleapis.com\/ajax\/libs\/jquery\/1.12.0\/jquery.min.js\"<\/span>><\/script>\r\n  <script src=\"https:\/\/maxcdn.bootstrapcdn.com\/bootstrap\/3.3.6\/js\/bootstrap.min.js\"<\/span>><\/script>\r\n<\/body>\r\n<\/html><\/pre>\n
<\/code>\n  <\/div>\n
\n
\u5168\u5bbdJumbotron <\/h3>\n
\n    \u8981\u83b7\u5f97\u6ca1\u6709\u5706\u89d2\u8fb9\u754c\u7684\u5de8\u578b\u98de\u8239\uff0c\u60a8\u5fc5\u987b\u5728\u5176\u4e2d\u6dfb\u52a0.jumbotron-fluid\u7c7b\u548c.container\u6216.container-fluid\n  <\/div>\n
\u793a\u4f8b: <\/h3>\n
\n
<!DOCTYPE html>\r\n<html lang=\"en\"<\/span>>\r\n<head>\r\n  <title>Bootstrap Example<\/title>\r\n  <meta charset=\"utf-8\"<\/span>>\r\n  <meta name=\"viewport\"<\/span> content=\"width=device-width, initial-scale=1\"<\/span>>\r\n  <link rel=\"stylesheet\"<\/span> href=\"https:\/\/maxcdn.bootstrapcdn.com\/bootstrap\/4.0.0-beta.2\/css\/bootstrap.min.css\"<\/span>>\r\n  <script src=\"https:\/\/ajax.googleapis.com\/ajax\/libs\/jquery\/3.2.1\/jquery.min.js\"<\/span>><\/script>\r\n  <script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/popper.js\/1.12.6\/umd\/popper.min.js\"<\/span>><\/script>\r\n  <script src=\"https:\/\/maxcdn.bootstrapcdn.com\/bootstrap\/4.0.0-beta.2\/js\/bootstrap.min.js\"<\/span>><\/script>\r\n<\/head>\r\n<body>\r\n<div class=\"jumbotron jumbotron-fluid\"<\/span>>\r\n  <div class=\"container\"<\/span><\/span>>\r\n    <h1>Full-width Jumbotron<\/h1>        \r\n  <p>Jumbotron specifies a big box for <\/span>getting extra attention to some special content or information.<\/p>\r\n<\/div>\r\n<div class=\"container\">\r\n  <p>this<\/span> is some text.<\/p>      \r\n  <p>this<\/span> is another text.<\/p>      \r\n<\/div>\r\n<\/body>\r\n<\/html><\/pre>\n
<\/code>\n  <\/div>\n
\n
Bootstrap \u9875\u7709<\/h3>\n
\n    \u9875\u7709\u5c31\u50cf\u8282\u5206\u9694\u7b26\u3002\n  <\/div>\n
\n    .page-header\u7c7b\u7528\u4e8e\u521b\u5efa\u9875\u9762\u6807\u9898\u3002\n  <\/div>\n
\n    \u793a\u4f8b:\n  <\/div>\n
\n
<!DOCTYPE html>\r\n<html lang=\"en\"<\/span>>\r\n<head>\r\n  <title>Bootstrap Example<\/title>\r\n  <meta charset=\"utf-8\"<\/span>>\r\n  <meta name=\"viewport\"<\/span> content=\"width=device-width, initial-scale=1\"<\/span>>\r\n  <link rel=\"stylesheet\"<\/span> href=\"https:\/\/maxcdn.bootstrapcdn.com\/bootstrap\/3.3.6\/css\/bootstrap.min.css\"<\/span>>\r\n<\/head>\r\n<body>\r\n<div class=\"container\"<\/span>>\r\n  <div class=\"page-header\"<\/span>>\r\n    <h1>Example Page Header<\/h1>      \r\n  <\/div>\r\n  <p>this<\/span> is some text.<\/p>      \r\n  <p>this<\/span> is another text.<\/p>      \r\n<\/div>\r\n  <script src=\"https:\/\/ajax.googleapis.com\/ajax\/libs\/jquery\/1.12.0\/jquery.min.js\"<\/span>><\/script>\r\n  <script src=\"https:\/\/maxcdn.bootstrapcdn.com\/bootstrap\/3.3.6\/js\/bootstrap.min.js\"<\/span>><\/script>\r\n<\/body>\r\n<\/html><\/pre>\n
<\/code>\n  <\/div>\n
 <\/body>
\n<\/html><\/p>\n","protected":false},"excerpt":{"rendered":"Bootstrap Jumbotronzh-cn","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[163],"tags":[],"class_list":["post-1980","post","type-post","status-publish","format-standard","hentry","category-bootstrapjc"],"_links":{"self":[{"href":"https:\/\/bianchenghao6.com\/wp-json\/wp\/v2\/posts\/1980"}],"collection":[{"href":"https:\/\/bianchenghao6.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/bianchenghao6.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/bianchenghao6.com\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/bianchenghao6.com\/wp-json\/wp\/v2\/comments?post=1980"}],"version-history":[{"count":0,"href":"https:\/\/bianchenghao6.com\/wp-json\/wp\/v2\/posts\/1980\/revisions"}],"wp:attachment":[{"href":"https:\/\/bianchenghao6.com\/wp-json\/wp\/v2\/media?parent=1980"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/bianchenghao6.com\/wp-json\/wp\/v2\/categories?post=1980"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/bianchenghao6.com\/wp-json\/wp\/v2\/tags?post=1980"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}