Maison > interface Web > tutoriel HTML > le corps du texte

CSS若干常见问题小结_html/css_WEB-ITnose

WBOY
Libérer: 2016-06-24 11:50:52
original
1152 Les gens l'ont consulté

1.边框部分问题

【边框为虚线】

border:1px dashed #ddd;
Copier après la connexion

【边框为实线】

 border:1px solid #ddd; 
Copier après la connexion

【table中的tr加下划线边框】

 在css中做如下声明

 .mytable{border-collapse: collapse;} 
Copier après la connexion

【table 中的单元格 出现间断边框】

Copier après la connexion
Copier après la connexion


2. 表单部分问题


【给单选/复选 添加文字可选信息】


Copier après la connexion
Copier après la connexion


注意使用 label 标签时 for属性的值  对应的是表单中元素的id属性的值


3. 表格部分问题


【td内 文字的对齐问题】

【td 文字垂直对齐】

<td valign="top"></td>
Copier après la connexion

属性可选值: top   middle    bottom    baseline

【td 文字水平对齐】

<td align="center"></td>
Copier après la connexion

 属性可选值:left  right   center   justify

【tr中设置行高】

 不建议使用 height属性 这样会使部分内容隐藏

 line-height:15px; /*建议使用此属性*/
Copier après la connexion

【td中如果内容为空】

 请使用空格字符填充:   
 这样即使没有 内容 依然会填充空白进去

【table中的tr加下划线边框】

 在css中做如下声明

 .mytable{border-collapse: collapse;}  tr{border:1px solid #ddd;}
Copier après la connexion

4. 滚动条部分问题

【不想出现滚动条】

 overflow:hidden;
Copier après la connexion
【不想出现水平滚动条】
 overflow-x:hidden; overflow-y:auto;
Copier après la connexion

【不想出现垂直滚动条】

 overflow-y:hidden; overflow-x:auto;
Copier après la connexion

【不想出现滚动条 但是垂直方向高度随内容自增长】

 overflow-x:hidden; overflow-y:auto; min-hight :xxx px;
Copier après la connexion

[注意:] 使用此法 必须确保 自增长的高度包括了 padding 和 margin 否则还是会出现垂直滚动条
 
 那么需要注意的是 dom中的元素(除了height外 还必须考虑 margin和padding)没有超出 父容器的实际高度

【那么水平方向同上 修改部分参数即可】

【若想出现滚动条,但是是出现在浏览器边框滚动条】

overflow:visible;
Copier après la connexion






Étiquettes associées:
source:php.cn
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
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal