wulin.comの記事紹介(www.vevb.com):私は、Chinazの滝の滝のレイアウトはとても良いと思っていました。私は以前に他の人によって実装されたいくつかの方法を見てきましたが、そのほとんどはJSを使用して実装されています。私は今日それを試してみましたが、CSS3で同様のレイアウト効果を達成しました。私はそれが誰にとっても役に立つことを願っています! Chinazの効果
私は、Chinazの写真滝のレイアウトはとても良いと思っていました。私は以前に他の人によって実装されたいくつかの方法を見てきましたが、そのほとんどはJSを使用して実装されています。今日、私はそれを試して、CSS3で同様のレイアウト効果を実装しました。私はそれが誰にとっても役に立つことを願っています! Chinazの効果:
私のコード:
CSS3の滝layout.container {-webkit-column-width-moz-moz-moz-column-width-ocolumn-webkit-column-gap-moz-column-gap-o-column-gapdiv:not(.container){ - - - webkit-border-radius-moz-moz-border-radiusborder-radiusbackgrounddisplaywidthpositionmargin.title {line-heighttext-alignfont-familypure CSS3ウォーターフォールレイアウト
実行効果(Firefox、Google Chromeの下でテストに合格しましたが、他のブラウザはテストしませんでした~~):