Rumah pembangunan bahagian belakang tutorial php 这样的列表显示是如何循环的呢

这样的列表显示是如何循环的呢

Jun 13, 2016 pm 01:17 PM
gt lt px quot style

这样的列表显示是怎么循环的呢
怎么没有上传图片功能的

这样不规则的图片循环怎么写代码? 



------解决方案--------------------

PHP code



<meta charset="utf-8">
<style>
.main_wrapper{width:900px;min-height:200px;margin:10px auto;overflow:hidden;}
.two_pictures{width:200px;float:left;margin-bottom:10px;padding:5px;margin:6px;}
.main_wrapper,.two_pictures,img{border:1px solid #ABC;}
.pic_1{height:150px;width:200px;}
.pic_2{height:100px;width:200px;}
<!--样式随便改-->
</style>

<div class="main_wrapper">
<?php for($i=0;$i<8;++$i){
if(($i)%2==0){
$style1="pic_2";
$style2="pic_1";
}else{
$style1="pic_1";
$style2="pic_2";
}
$picArr = array(
"http://www.iimei.com/1/xunhuan.jpg",
"http://www.iimei.com/1/xunhuan.jpg"
);//把图片改为动态的,自已调整
echo '
    <div class="two_pictures">
    <img  src="/static/imghw/default1.png" data-src="'.$picArr[0].'" class="lazy" . alt=" 这样的列表显示是如何循环的呢 " >
    <span>This is a test</span>
    <img  src="/static/imghw/default1.png" data-src="'.$picArr[1].'" class="lazy" . alt=" 这样的列表显示是如何循环的呢 " >
    <span>This is a test</span>
    </div>
';
}
?>
    


 <div class="clear">
                 
              
              
        
            </div>
Salin selepas log masuk
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn

Alat AI Hot

Undresser.AI Undress

Undresser.AI Undress

Apl berkuasa AI untuk mencipta foto bogel yang realistik

AI Clothes Remover

AI Clothes Remover

Alat AI dalam talian untuk mengeluarkan pakaian daripada foto.

Undress AI Tool

Undress AI Tool

Gambar buka pakaian secara percuma

Clothoff.io

Clothoff.io

Penyingkiran pakaian AI

AI Hentai Generator

AI Hentai Generator

Menjana ai hentai secara percuma.

Artikel Panas

R.E.P.O. Kristal tenaga dijelaskan dan apa yang mereka lakukan (kristal kuning)
3 minggu yang lalu By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Tetapan grafik terbaik
3 minggu yang lalu By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Cara Memperbaiki Audio Jika anda tidak dapat mendengar sesiapa
3 minggu yang lalu By 尊渡假赌尊渡假赌尊渡假赌
WWE 2K25: Cara Membuka Segala -galanya Di Myrise
4 minggu yang lalu By 尊渡假赌尊渡假赌尊渡假赌

Alat panas

Notepad++7.3.1

Notepad++7.3.1

Editor kod yang mudah digunakan dan percuma

SublimeText3 versi Cina

SublimeText3 versi Cina

Versi Cina, sangat mudah digunakan

Hantar Studio 13.0.1

Hantar Studio 13.0.1

Persekitaran pembangunan bersepadu PHP yang berkuasa

Dreamweaver CS6

Dreamweaver CS6

Alat pembangunan web visual

SublimeText3 versi Mac

SublimeText3 versi Mac

Perisian penyuntingan kod peringkat Tuhan (SublimeText3)

Apakah perbezaan antara Huawei GT3 Pro dan GT4? Apakah perbezaan antara Huawei GT3 Pro dan GT4? Dec 29, 2023 pm 02:27 PM

Ramai pengguna akan memilih jenama Huawei apabila memilih jam tangan pintar Antaranya, Huawei GT3pro dan GT4 adalah pilihan yang sangat popular. Apakah perbezaan antara Huawei GT3pro dan GT4? 1. Rupa GT4: 46mm dan 41mm, bahan cermin kaca + badan keluli tahan karat + cangkang belakang gentian resolusi tinggi. GT3pro: 46.6mm dan 42.9mm, bahannya ialah kaca nilam + badan titanium/badan seramik + cangkerang belakang seramik 2. GT4 yang sihat: Menggunakan algoritma Huawei Truseen5.5+ terkini, hasilnya akan lebih tepat. GT3pro: Penambahan elektrokardiogram ECG dan saluran darah serta keselamatan

Bagaimana untuk mengubah suai elemen.gaya Bagaimana untuk mengubah suai elemen.gaya Nov 24, 2023 am 11:15 AM

Kaedah untuk elemen.gaya untuk mengubah suai elemen: 1. Ubah suai warna latar belakang elemen; 2. Ubah suai saiz fon elemen; Ubah suai penjajaran mendatar elemen. Pengenalan terperinci: 1. Ubah suai warna latar belakang elemen, sintaksnya ialah "document.getElementById("myElement").style.backgroundColor = "red";" 2. Ubah suai saiz fon elemen, dsb.

Betulkan: Alat snipping tidak berfungsi dalam Windows 11 Betulkan: Alat snipping tidak berfungsi dalam Windows 11 Aug 24, 2023 am 09:48 AM

Mengapa Alat Snipping Tidak Berfungsi pada Windows 11 Memahami punca masalah boleh membantu mencari penyelesaian yang betul. Berikut ialah sebab utama Alat Snipping mungkin tidak berfungsi dengan betul: Focus Assistant dihidupkan: Ini menghalang Snipping Tool daripada dibuka. Aplikasi rosak: Jika alat snipping ranap semasa pelancaran, ia mungkin rosak. Pemacu grafik lapuk: Pemacu yang tidak serasi mungkin mengganggu alat snipping. Gangguan daripada aplikasi lain: Aplikasi lain yang sedang berjalan mungkin bercanggah dengan Alat Snipping. Sijil telah tamat tempoh: Ralat semasa proses naik taraf boleh menyebabkan penyelesaian mudah ini sesuai untuk kebanyakan pengguna dan tidak memerlukan sebarang pengetahuan teknikal khusus. 1. Kemas kini apl Windows dan Microsoft Store

Cara mengubah suai gaya secara dinamik dalam bertindak balas Cara mengubah suai gaya secara dinamik dalam bertindak balas Dec 28, 2022 am 10:44 AM

Kaedah untuk bertindak balas untuk mengubah suai gaya secara dinamik: 1. Tambahkan ref pada elemen yang gayanya perlu diubah suai, dengan sintaks seperti "<div className='scroll-title clear-fix' ref={ this.manage }>" 2 . Melalui kawalan dinamik Perubahan keadaan mengubah gaya elemen 3. Dengan menggunakan kod JS dalam DOM, peralihan paparan dan penyembunyian DOM yang berbeza direalisasikan.

Apakah ciri baharu dalam gaya Vue3 dan cara menggunakannya Apakah ciri baharu dalam gaya Vue3 dan cara menggunakannya May 14, 2023 pm 10:52 PM

Ciri baharu gaya versi Vue3.2 telah membuat banyak peningkatan kepada gaya komponen fail tunggal, seperti gaya setempat, pembolehubah css dan gaya yang terdedah kepada templat. (Perkongsian video pembelajaran: tutorial video vue) 1. Gaya setempat Apabila label mempunyai atribut berskop, CSSnya hanya akan digunakan pada elemen komponen semasa: hi.example{color:red;} 2. Pemilih kedalaman ialah scoped Jika pemilih dalam gaya ingin membuat pemilihan yang lebih "mendalam", iaitu mempengaruhi sub-komponen, anda boleh menggunakan :deep() pseudo-class: .a:deep(.b){/*.. .*/ }Kandungan DOM yang dibuat melalui v-html tidak akan

Evolusi dan aplikasi unit susun atur CSS: daripada piksel kepada unit relatif berdasarkan saiz fon elemen akar Evolusi dan aplikasi unit susun atur CSS: daripada piksel kepada unit relatif berdasarkan saiz fon elemen akar Jan 05, 2024 pm 05:41 PM

Dari px ke rem: Evolusi dan aplikasi unit susun atur CSS Pengenalan: Dalam pembangunan bahagian hadapan, kita selalunya perlu menggunakan CSS untuk melaksanakan reka letak halaman. Sejak beberapa tahun kebelakangan ini, unit susun atur CSS telah berkembang dan berkembang. Pada mulanya kami menggunakan piksel (px) sebagai unit untuk menetapkan saiz dan kedudukan elemen. Walau bagaimanapun, dengan peningkatan reka bentuk responsif dan populariti peranti mudah alih, unit piksel telah mendedahkan beberapa masalah secara beransur-ansur. Untuk menyelesaikan masalah ini, rem unit baharu wujud dan secara beransur-ansur digunakan secara meluas dalam reka letak CSS. satu

Cara Membetulkan Ralat Tidak Dapat Menyambung ke App Store pada iPhone Cara Membetulkan Ralat Tidak Dapat Menyambung ke App Store pada iPhone Jul 29, 2023 am 08:22 AM

Bahagian 1: Langkah Penyelesaian Masalah Awal Menyemak Status Sistem Apple: Sebelum menyelidiki penyelesaian yang rumit, mari kita mulakan dengan asas. Masalahnya mungkin tidak terletak pada peranti anda; Lawati halaman Status Sistem Apple untuk melihat sama ada AppStore berfungsi dengan betul. Jika terdapat masalah, anda hanya boleh menunggu Apple membetulkannya. Semak sambungan Internet anda: Pastikan anda mempunyai sambungan internet yang stabil kerana isu "Tidak dapat menyambung ke AppStore" kadangkala boleh dikaitkan dengan sambungan yang lemah. Cuba tukar antara Wi-Fi dan data mudah alih atau tetapkan semula tetapan rangkaian (Umum > Tetapkan Semula > Tetapkan Semula Tetapan Rangkaian > Tetapan). Kemas kini versi iOS anda:

Ralat Vue: Tidak dapat menggunakan v-bind untuk mengikat kelas dan gaya dengan betul, bagaimana untuk menyelesaikannya? Ralat Vue: Tidak dapat menggunakan v-bind untuk mengikat kelas dan gaya dengan betul, bagaimana untuk menyelesaikannya? Aug 26, 2023 pm 10:58 PM

Ralat Vue: Tidak dapat menggunakan v-bind untuk mengikat kelas dan gaya dengan betul, bagaimana untuk menyelesaikannya? Dalam pembangunan Vue, kami sering menggunakan arahan v-bind untuk mengikat kelas dan gaya secara dinamik, tetapi kadangkala kami mungkin menghadapi beberapa masalah, seperti tidak dapat menggunakan v-bind dengan betul untuk mengikat kelas dan gaya. Dalam artikel ini, saya akan menerangkan punca masalah ini dan memberi anda penyelesaian. Pertama, mari kita fahami arahan v-bind. v-bind digunakan untuk mengikat V

See all articles