之前项目开发,零零散散笔记了些开发的知识,一直没有想整理总结,现在写博客整理吧
css篇
1.如何让div中的内容垂直居中
内边距(padding)法
padding-top: 4px;
padding-right: 4px;
padding-bottom: 4px;
padding-left: 4px;
2.如何让div显示边框样式呢?
.divcss5{border:1px solid #F00}
3.CSS3 圆角(border-radius)
-moz用于Firefox
-webkit用于Safari和Chrome。
例如
#round {
padding:10px; width:300px; height:50px;
border: 5px solid #dedede;
-moz-border-radius: 15px; /* Gecko browsers */
-webkit-border-radius: 15px; /* Webkit browsers */
border-radius:15px; /* W3C syntax */
}
4.web手机字体自适应
css方法
@media screen and (min-width: 320px) {
html {font-size: 12px;}
}
@media screen and (min-width: 360px) {
html {font-size: 14px;}
}
@media screen and (min-width: 400px) {
html {font-size: 16px;}
}
@media screen and (min-width: 440px) {
html {font-size: 18px;}
}
@media screen and (min-width: 480px) {
html {font-size: 20px;}
}
@media screen and (min-width: 640px) {
html {font-size: 26px;}
}
标签就可用:font-size: 1.0rem,然后字体size就会根据屏幕适应了。
5.规定段落中的文本不进行换行:
p{
white-space: nowrap
}
<small>normal默认。空白会被浏览器忽略。
nowrap文本不会换行,文本会在在同一行上继续,直到遇到标签为止。
pre-wrap保留空白符序列,但是正常地进行换行。
pre-line合并空白符序列,但是保留换行符。
<small>