Skip to content

Commit

Permalink
fixes image demo src
Browse files Browse the repository at this point in the history
  • Loading branch information
Minwe committed Jan 6, 2015
1 parent 224523b commit a80d0ac
Showing 1 changed file with 11 additions and 11 deletions.
22 changes: 11 additions & 11 deletions docs/css/image.md
Original file line number Diff line number Diff line change
Expand Up @@ -22,10 +22,10 @@ img {
如上面的代码所示, `base` 里已经设置了 `max-width: 100%`,图片会自动适应到容器的宽度(但不会超过图片原始宽度),不需要添加额外的 class([演示](http://jsbin.com/ciduf/1))。如果要让图片始终和容器一样宽,需要设置 `width: 100%`

`````html
<img src="http://http://7jpqbr.com1.z0.glb.clouddn.com/bw-2014-06-19.jpg" alt=""/>
<img src="http://7jpqbr.com1.z0.glb.clouddn.com/bw-2014-06-19.jpg" alt=""/>
`````
```html
<img src="http://http://7jpqbr.com1.z0.glb.clouddn.com/bw-2014-06-19.jpg" alt=""/>
<img src="http://7jpqbr.com1.z0.glb.clouddn.com/bw-2014-06-19.jpg" alt=""/>
```

## 增强样式
Expand All @@ -39,17 +39,17 @@ img {
- `.am-circle` 圆形,一般用于正方形的图片(你要觉得椭圆好看,用在长方形上也可以)

`````html
<p><img class="am-radius" alt="140*140" src="http://http://7jpqbr.com1.z0.glb.clouddn.com/bw-2014-06-19.jpg?imageView/1/w/1000/h/1000/q/80" width="140" height="140" />
<img class="am-round" alt="140*140" src="http://http://7jpqbr.com1.z0.glb.clouddn.com/bw-2014-06-19.jpg?imageView/1/w/1000/h/600/q/80" width="200" height="120"/>
<img class="am-circle" src="http://http://7jpqbr.com1.z0.glb.clouddn.com/bw-2014-06-19.jpg?imageView/1/w/1000/h/1000/q/80" width="140" height="140"/></p>
<p><img class="am-radius" alt="140*140" src="http://7jpqbr.com1.z0.glb.clouddn.com/bw-2014-06-19.jpg?imageView/1/w/1000/h/1000/q/80" width="140" height="140" />
<img class="am-round" alt="140*140" src="http://7jpqbr.com1.z0.glb.clouddn.com/bw-2014-06-19.jpg?imageView/1/w/1000/h/600/q/80" width="200" height="120"/>
<img class="am-circle" src="http://7jpqbr.com1.z0.glb.clouddn.com/bw-2014-06-19.jpg?imageView/1/w/1000/h/1000/q/80" width="140" height="140"/></p>
`````
```html
<p>
<img class="am-radius" alt="140*140" src="http://http://7jpqbr.com1.z0.glb.clouddn.com/bw-2014-06-19.jpg?imageView/1/w/1000/h/1000/q/80" width="140" height="140" />
<img class="am-radius" alt="140*140" src="http://7jpqbr.com1.z0.glb.clouddn.com/bw-2014-06-19.jpg?imageView/1/w/1000/h/1000/q/80" width="140" height="140" />

<img class="am-round" alt="140*140" src="http://http://7jpqbr.com1.z0.glb.clouddn.com/bw-2014-06-19.jpg?imageView/1/w/1000/h/600/q/80" width="200" height="120"/>
<img class="am-round" alt="140*140" src="http://7jpqbr.com1.z0.glb.clouddn.com/bw-2014-06-19.jpg?imageView/1/w/1000/h/600/q/80" width="200" height="120"/>

<img class="am-circle" src="http://http://7jpqbr.com1.z0.glb.clouddn.com/bw-2014-06-19.jpg?imageView/1/w/1000/h/1000/q/80" width="140" height="140"/>
<img class="am-circle" src="http://7jpqbr.com1.z0.glb.clouddn.com/bw-2014-06-19.jpg?imageView/1/w/1000/h/1000/q/80" width="140" height="140"/>
</p>
```

Expand All @@ -59,11 +59,11 @@ img {
- `.am-img-thumbnail` 边框

`````html
<img class="am-img-thumbnail" alt="140*140" src="http://http://7jpqbr.com1.z0.glb.clouddn.com/bw-2014-06-19.jpg?imageView/1/w/1000/h/1000/q/80" width="140" height="140" />
<img class="am-img-thumbnail" alt="140*140" src="http://7jpqbr.com1.z0.glb.clouddn.com/bw-2014-06-19.jpg?imageView/1/w/1000/h/1000/q/80" width="140" height="140" />

<img class="am-img-thumbnail am-radius" alt="140*140" src="http://http://7jpqbr.com1.z0.glb.clouddn.com/bw-2014-06-19.jpg?imageView/1/w/1000/h/1000/q/80" width="140" height="140" />
<img class="am-img-thumbnail am-radius" alt="140*140" src="http://7jpqbr.com1.z0.glb.clouddn.com/bw-2014-06-19.jpg?imageView/1/w/1000/h/1000/q/80" width="140" height="140" />

<img class="am-img-thumbnail am-circle" alt="140*140" src="http://http://7jpqbr.com1.z0.glb.clouddn.com/bw-2014-06-19.jpg?imageView/1/w/1000/h/1000/q/80" width="140" height="140" />
<img class="am-img-thumbnail am-circle" alt="140*140" src="http://7jpqbr.com1.z0.glb.clouddn.com/bw-2014-06-19.jpg?imageView/1/w/1000/h/1000/q/80" width="140" height="140" />
`````

```html
Expand Down

0 comments on commit a80d0ac

Please sign in to comment.