1.css像素(px)是一种抽象像素,又被称为与设备无关像素。不同于设备的机械的、物理的像素。
2.让浏览器自适应系统分辨率宽度的html代码:
<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no, width=device-width">
3.系统分辨率指的是视口大小。
4.导航栏基础样式:
.nav-list-item{
float:left;
width:25%;
width:calc(100%/4);
}
5.要有渐进增强和优雅降级的意识。
先看到这里,以后再补充剩下的章节
6.首先看一段html代码
<nav>
<ul>
<li><a>文字1<a><li>
<li><a>文字2<a><li>
<li><a>文字3<a><li>
<ul>
<nav>
让文字垂直居中的方法:
nav{
height:30px;
line-height:30px;
}
但是这样会有一个问题,height属性和line-height属性可能在不同 的样式片段中。
解决办法:
li a {
display:block;
padding:20px 40px;
}
先设置为块级元素才能使边距生效
第四章:媒体查询
看一段媒体查询代码
@media only screen and (max-width:600px){
.sidebar{display:none;}
}
代码的含义:
当页面仅在屏幕上显示,且页面宽度不超过600px时,让侧边栏隐藏。