CSS框架可以幫助我們快速搭建頁面，其中居中顯示圖片是常見需求之一。下面介紹如何使用CSS框架實(shí)現(xiàn)圖片居中顯示。

/*CSS樣式表*/
.container {
display: flex; /*設(shè)置容器為彈性布局*/
justify-content: center; /*設(shè)定主軸方向居中對(duì)齊*/
align-items: center; /*設(shè)定交叉軸方向居中對(duì)齊*/
}

首先，在HTML文檔中加上包裹圖片的容器DIV，這個(gè)容器DIV要設(shè)置成彈性布局。具體的樣式如下：

<div class="container">
</div>

這樣，圖片會(huì)被包裹在一個(gè)容器里，并顯示在容器的中心位置。這個(gè)方法使用了CSS3的flex屬性，該屬性可以設(shè)定容器的主軸和交叉軸方向上的對(duì)齊方式。其中，justify-content屬性設(shè)定主軸方向的對(duì)齊方式，align-items屬性設(shè)定交叉軸方向的對(duì)齊方式。

總的來說，在CSS框架中實(shí)現(xiàn)居中顯示圖片很簡(jiǎn)單，只需要使用彈性布局即可輕松實(shí)現(xiàn)。