communauté Apprendre Bibliothèque d'outils Loisirs
recherche
Français
Maison > interface Web > tutoriel HTML > 图片缩小和图片定位_html/css_WEB-ITnose

图片缩小和图片定位_html/css_WEB-ITnose

WBOY
Libérer： 2016-06-24 12:03:41
original
1781 Les gens l'ont consulté

想做一个缩略图 但全图缩图又太小了 
就缩到一个合适的大小 用overflow剪出显示大小的 
但图片的定位是从左边开始的  图片中的一些信息也剪掉了
请前辈指点 

.post{float: left;width: 210px;height: 150px;overflow:hidden;background-color: #fff;margin: 10px 0px 0px 10px;}.post img{max-width: 300px;max-height: 167px;}
Copier après la connexion

效果如下


回复讨论(解决方案)

用于裁剪的div设置相对定位 position:relative;
然后 缩小后的图片设置绝对定位，那么你就可以通过控制定位的left或者top来显示你想要的区域，多出的区域即被div裁掉

用于裁剪的div设置相对定位 position:relative;
然后 缩小后的图片设置绝对定位，那么你就可以通过控制定位的left或者top来显示你想要的区域，多出的区域即被div裁掉


正解


用于裁剪的div设置相对定位 position:relative;
然后 缩小后的图片设置绝对定位，那么你就可以通过控制定位的left或者top来显示你想要的区域，多出的区域即被div裁掉


正解
Étiquettes associées：
图片 定位 dézoomer
source：php.cn
Article précédent：Linux(CentOS)搭建SVN服务器全攻略_html/css_WEB-ITnose Article suivant：<h1>不对应</h2> 为什么还是可以显示的_html/css_WEB-ITnose
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
Derniers articles par auteur
Derniers numéros
function_exists() ne peut pas déterminer la fonction personnalisée Function test () {return true;} if (function_exists ('test')) {echo "le test est une ...
Depuis 2024-04-29 11:01:01
0
2
1429
Expression régulière pour faire correspondre les mots J'ai un script dans lequel j'essaie de faire correspondre les nouveaux noms de travaux ave...
Depuis 2024-04-06 21:24:04
0
1
606
Utiliser des grilles pour créer cette conception spécifique : un guide étape par étape J'essaie de créer une mise en page similaire à cette image, j'ai essayé d'utiliser cette g...
Depuis 2024-04-06 20:29:08
0
2
492
Sélectionnez les produits liés au woocommerce à l'aide d'une taxonomie personnalisée avec une hiérarchie à 3 niveaux J'ai une boutique woocommerce avec une classification personnalisée « Sports ». La classif...
Depuis 2024-04-06 20:05:30
0
1
544
Comment utiliser les composants Laravel avec des espaces réservés paresseux Livewire Je souhaite ajouter le squelette de mon composant Laravel dans un espace réservé livewire3...
Depuis 2024-04-06 20:02:10
0
2
543
Rubriques connexes
Plus>
Recommandations populaires
Tutoriels populaires
Plus>
Tutoriels associés
Recommandations populaires
Derniers cours
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal