Maison développement back-end tutoriel php 这样的列表显示是如何循环的呢

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

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

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

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



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

PHP code

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

39

40

41

42

<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>

Copier après la connexion
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn

Outils d'IA chauds

Undresser.AI Undress

Undresser.AI Undress

Application basée sur l'IA pour créer des photos de nu réalistes

AI Clothes Remover

AI Clothes Remover

Outil d'IA en ligne pour supprimer les vêtements des photos.

Undress AI Tool

Undress AI Tool

Images de déshabillage gratuites

Clothoff.io

Clothoff.io

Dissolvant de vêtements AI

AI Hentai Generator

AI Hentai Generator

Générez AI Hentai gratuitement.

Article chaud

R.E.P.O. Crystals d'énergie expliqués et ce qu'ils font (cristal jaune)
2 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
Repo: Comment relancer ses coéquipiers
1 Il y a quelques mois By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island Adventure: Comment obtenir des graines géantes
4 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
Combien de temps faut-il pour battre Split Fiction?
3 Il y a quelques semaines By DDD

Outils chauds

Bloc-notes++7.3.1

Bloc-notes++7.3.1

Éditeur de code facile à utiliser et gratuit

SublimeText3 version chinoise

SublimeText3 version chinoise

Version chinoise, très simple à utiliser

Envoyer Studio 13.0.1

Envoyer Studio 13.0.1

Puissant environnement de développement intégré PHP

Dreamweaver CS6

Dreamweaver CS6

Outils de développement Web visuel

SublimeText3 version Mac

SublimeText3 version Mac

Logiciel d'édition de code au niveau de Dieu (SublimeText3)

Quelles sont les différences entre Huawei GT3 Pro et GT4 ? Quelles sont les différences entre Huawei GT3 Pro et GT4 ? Dec 29, 2023 pm 02:27 PM

De nombreux utilisateurs choisiront la marque Huawei lors du choix des montres intelligentes. Parmi eux, les Huawei GT3pro et GT4 sont des choix très populaires. De nombreux utilisateurs sont curieux de connaître la différence entre Huawei GT3pro et GT4. Quelles sont les différences entre Huawei GT3pro et GT4 ? 1. Apparence GT4 : 46 mm et 41 mm, le matériau est un miroir en verre + un corps en acier inoxydable + une coque arrière en fibre haute résolution. GT3pro : 46,6 mm et 42,9 mm, le matériau est du verre saphir + corps en titane/corps en céramique + coque arrière en céramique 2. GT4 sain : en utilisant le dernier algorithme Huawei Truseen5.5+, les résultats seront plus précis. GT3pro : ajout d'un électrocardiogramme ECG, d'un vaisseau sanguin et de la sécurité

Comment modifier element.style Comment modifier element.style Nov 24, 2023 am 11:15 AM

Méthodes permettant à element.style de modifier les éléments : 1. Modifier la couleur d'arrière-plan de l'élément ; 2. Modifier la taille de la police de l'élément ; 3. Modifier le style de bordure de l'élément ; . Modifier l'alignement horizontal de l'élément. Introduction détaillée : 1. Modifiez la couleur d'arrière-plan de l'élément, la syntaxe est "document.getElementById("myElement").style.backgroundColor = "red";" 2. Modifiez la taille de la police de l'élément, etc.

Correctif : l'outil de capture ne fonctionne pas sous Windows 11 Correctif : l'outil de capture ne fonctionne pas sous Windows 11 Aug 24, 2023 am 09:48 AM

Pourquoi l'outil Snipping ne fonctionne pas sous Windows 11 Comprendre la cause première du problème peut aider à trouver la bonne solution. Voici les principales raisons pour lesquelles l'outil de capture peut ne pas fonctionner correctement : L'assistant de mise au point est activé : cela empêche l'ouverture de l'outil de capture. Application corrompue : si l'outil de capture plante au lancement, il est peut-être corrompu. Pilotes graphiques obsolètes : des pilotes incompatibles peuvent interférer avec l'outil de capture. Interférence provenant d'autres applications : d'autres applications en cours d'exécution peuvent entrer en conflit avec l'outil de capture. Le certificat a expiré : une erreur lors du processus de mise à niveau peut provoquer ce problème. Solution simple. Celles-ci conviennent à la plupart des utilisateurs et ne nécessitent aucune connaissance technique particulière. 1. Mettez à jour les applications Windows et Microsoft Store

Comment modifier dynamiquement le style en réaction Comment modifier dynamiquement le style en réaction Dec 28, 2022 am 10:44 AM

Méthodes pour réagir pour modifier dynamiquement le style : 1. Ajoutez une référence à l'élément dont le style doit être modifié, avec une syntaxe telle que "<div className='scroll-title clear-fix' ref={ this.manage }>" ; . Grâce au contrôle dynamique Le changement d'état modifie le style de l'élément ; 3. En utilisant le code JS dans le DOM, l'affichage et le masquage des transitions des différents DOM sont réalisés.

Quelles sont les nouvelles fonctionnalités du style Vue3 et comment les utiliser Quelles sont les nouvelles fonctionnalités du style Vue3 et comment les utiliser May 14, 2023 pm 10:52 PM

Nouvelles fonctionnalités du style La version Vue3.2 a apporté de nombreuses mises à niveau au style des composants à fichier unique, tels que les styles locaux, les variables CSS et les styles exposés aux modèles. (Partage vidéo d'apprentissage : tutoriel vidéo vue) 1. Style local Lorsque l'étiquette a un attribut scoped, son CSS ne sera appliqué qu'aux éléments du composant courant : hi.example{color:red;} 2. Le sélecteur de profondeur est scoped Si le sélecteur du style souhaite effectuer une sélection plus "profonde", c'est-à-dire affecter les sous-composants, vous pouvez utiliser la pseudo-classe :deep() : .a:deep(.b){/*.. .*/ }Le contenu DOM créé via v-html ne sera pas

Comment réparer l'erreur Impossible de se connecter à l'App Store sur iPhone Comment réparer l'erreur Impossible de se connecter à l'App Store sur iPhone Jul 29, 2023 am 08:22 AM

Partie 1 : étapes de dépannage initiales Vérification de l'état du système Apple : avant d'aborder des solutions complexes, commençons par les bases. Le problème ne vient peut-être pas de votre appareil ; les serveurs Apple sont peut-être en panne. Visitez la page État du système d'Apple pour voir si l'AppStore fonctionne correctement. S'il y a un problème, tout ce que vous pouvez faire est d'attendre qu'Apple le résolve. Vérifiez votre connexion Internet : assurez-vous que vous disposez d'une connexion Internet stable, car le problème "Impossible de se connecter à l'AppStore" peut parfois être attribué à une mauvaise connexion. Essayez de basculer entre le Wi-Fi et les données mobiles ou de réinitialiser les paramètres réseau (Général > Réinitialiser > Réinitialiser les paramètres réseau > Paramètres). Mettez à jour votre version iOS :

L'évolution et l'application des unités de mise en page CSS : des pixels aux unités relatives basées sur la taille de police de l'élément racine L'évolution et l'application des unités de mise en page CSS : des pixels aux unités relatives basées sur la taille de police de l'élément racine Jan 05, 2024 pm 05:41 PM

De px à rem : L'évolution et l'application des unités de mise en page CSS Introduction : Dans le développement front-end, nous avons souvent besoin d'utiliser CSS pour implémenter la mise en page. Au cours des dernières années, les unités de mise en page CSS ont évolué et se sont développées. Au départ, nous utilisions les pixels (px) comme unité pour définir la taille et la position des éléments. Cependant, avec l’essor du responsive design et la popularité des appareils mobiles, les unités pixel ont progressivement révélé certains problèmes. Afin de résoudre ces problèmes, la nouvelle unité rem a vu le jour et a été progressivement largement utilisée dans la mise en page CSS. un

php提交表单通过后,弹出的对话框怎样在当前页弹出,该如何解决 php提交表单通过后,弹出的对话框怎样在当前页弹出,该如何解决 Jun 13, 2016 am 10:23 AM

php提交表单通过后,弹出的对话框怎样在当前页弹出php提交表单通过后,弹出的对话框怎样在当前页弹出而不是在空白页弹出?想实现这样的效果:而不是空白页弹出:------解决方案--------------------如果你的验证用PHP在后端,那么就用Ajax;仅供参考:HTML code

See all articles