图像高分辨率不调整大小适合div

我发现了很多话题，但我仍然没有找到解决我的问题的方法。当使用lorempixel的图像src时，我的代码工作得很好，但当使用图像本地(4000x3000)时，它不会调整大小以适应div。希望任何人都能帮助我。

我使用Bootstrap 3.1.1

<section class="portfolio">
    <div class="portfolio-list">
        <ul>
            <li>
                <div class="portfolio-box">
                <a href="#">
                    <img src="img/thumb-1.jpg" alt="Portfolio item">
                </a>
                </div>
            </li>
            <li>
                <div class="portfolio-box">
                <a href="#">
                    <img src="http://lorempixel.com/598/386/" alt="Portfolio item">
                </a>
                </div>
            </li>
            <li>
                <div class="portfolio-box">
                <a href="#">
                    <img src="http://lorempixel.com/598/386/" alt="Portfolio item">
                </a>
                </div>
            </li>
            <li>
                <div class="portfolio-box">
                <a href="#">
                    <img src="http://lorempixel.com/598/386/" alt="Portfolio item">
                </a>
                </div>
            </li>
            <li>
                <div class="portfolio-box">
                <a href="#">
                    <img src="http://lorempixel.com/598/386/" alt="Portfolio item">
                </a>
                </div>
            </li>
            <li>
                <div class="portfolio-box">
                <a href="#">
                    <img src="http://lorempixel.com/598/386/" alt="Portfolio item">
                </a>
                </div>
            </li>
        </ul>
    </div>  <!-- end portfolio-list -->
</section>  <!-- end portfolio -->

.portfolio-list{
    background-color: #cccccc;
    li{
        float: left;
        width: 33.33%;
        display: block;
    }
}