Une collection de points de connaissances CSS

Cet article présente une collection de points de connaissances CSS

CreateTime--29 septembre 2016 09:43:10
Auteur : Marydon
1. Dégradé linéaire de couleur d'arrière-plan

background-color:linear-gradient(100deg,#FFF,#111);/*由黑色向白色渐变 deg表示度数*/

UpdateTime--25 octobre 2016 11:37:53

UpdateTime--23 novembre 2016 09:53:46
2. les bordures de table doivent être fusionnées en une seule bordure

border-collapse: collapse;/*前提：table的border=1或border="1"或border="1px"*/

UpdateTime--29 octobre 2016 09:04 : 07

Définissez p minimum. hauteur et extension automatique de la hauteur

#pHeight{height:auto;min-height:5px;width:800px; background:#bbeeeb;margin:0 auto;} 　　

<p id="pHeight"> 　　　
此p具有最小高度且高度可以随着内容的增高而自动伸展 
<br/>　　此p具有最小高度且高度可以随着内容的增高而自动伸展 
</p>

Définir la largeur minimale et l'expansion automatique de la largeur

width:auto;min-width:5px;height:800px;

4. Deux façons de désactiver les sauts de ligne

Méthode 1 :
Généralement sur le navigateur Le document affiché sera automatiquement renvoyé lorsqu'il atteint le en bas de la bannière du navigateur, mais si le texte est contenu dans les balises ~, il ne sera pas enveloppé
Utilisez la balise < /nobr> 🎜> Utilisez le style CSS

style="white-space:nowrap;"

UpdateTime--25 novembre 2016 08:57: 49

Définissez td pour interdire les sauts de ligne

<td nowrap="nowrap"></td>

UpdateTime--31 octobre 2016 09:44:17

5.style d'affichage

en ligne Éléments en ligne (occupe une ligne avec d'autres éléments , pas de saut de ligne, impossible de définir la largeur et la hauteur)

block Éléments de niveau bloc (occupe une ligne seule, la largeur et la hauteur peuvent être définies)
inline-block Élément de niveau bloc en ligne (occupe une ligne avec d'autres éléments, mais peut définir la largeur et la hauteur) (a les caractéristiques à la fois des éléments en ligne et des éléments au niveau du bloc)
Aucun Masquer l'élément

document.getElementById("aa").style.display="";//表示的是：清除display样式，display将使用默认值（块元素会变成block，内联元素会变成inline）

UpdateTime- -24 novembre 2016 11:44:31

Syntaxe du mode 6.ime et syntaxe de transformation de texte

UpdateTime--15 décembre 2016 19 : 52:16

/*屏蔽输入法，可以用来禁止录入中文*/
　　ime-mode:disabled; //IE兼容，chrome不兼容
　　<input type="text" name="mobile" style="ime-mode:disabled;" />
/*将输入的英文字母转全部换成大写字母*/
　　text-transform:uppercase;
　　<input type="text" name="mobile" style="text-transform:uppercase;" />
UpdateTime--2017年1月9日10:23:23
/*将输入的英文字母转全部换成小写字母*/
　　text-transform:lowercase;
　　<input type="text" style="text-transform:lowercase;"/>

Introduction détaillée

Syntaxe du mode ime : (Cette syntaxe n'est pas valide sur le navigateur Google et doit être contrôlée avec js. Voir le fichier "Contrôle du contenu d'entrée de la zone de texte d'entrée")

ime-mode : auto | actif | désactivé

Valeur :
auto : valeur par défaut. N'affecte pas le statut de l'IME. Identique à lorsque l'attribut ime-mode n'est pas spécifié
Actif : Spécifie tous les caractères saisis à l'aide de IME. Il s’agit d’activer la méthode de saisie en langue locale. L'utilisateur peut toujours désactiver l'IME
inactif : Spécifie tous les caractères qui ne sont pas saisis à l'aide de l'IME. Il s’agit d’activer les langues non natives. L'utilisateur peut toujours désactiver l'IME
Désactivé : désactive complètement l'IME. Pour les contrôles ciblés (tels que les zones de saisie), l'utilisateur ne peut pas activer la syntaxe IME
　　text-transform :
　　text-transform : none | majuscule | minuscule
　Value :
　　 none :  Valeur par défaut. Aucune conversion ne se produit
majuscule : convertissez la première lettre de chaque mot en majuscule, et aucune conversion ne se produit pour le reste
Majuscule : convertissez en majuscule
Minuscule : convertissez en minuscule
7. Définissez p dans le contenu s'enroule automatiquement
Lorsque la boîte p a une hauteur et une largeur fixes, le contenu affiché dépasse la largeur de p et le contenu ne s'enroule pas au-delà du problème
Définir le style CSS

　　word-wrap:break-word;

8. Lorsque le contenu de p et li dépasse la largeur du conteneur, la partie excédentaire sera affichée sous la forme de ".."

Prérequis : La largeur de p et li doivent d'abord être déterminés

Ajouter des attributs

　　text-overflow:ellipsis;
　　white-space:nowrap;
　　overflow:hidden;

9. Contrôle du style d'affichage de la zone de texte et de la zone de mot de passe dans le navigateur IE

/*去除IE浏览器文本框右侧出现叉号*/
　　#aa::-ms-clear {
　　　　display:none;
　　}
　　/*去除IE浏览器密码框右侧出现眼睛*/
　　#bb::-ms-reveal {
　　　　display:none;
　　}

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!