pxcook使用（量尺寸）+盒子模型+残缺新浪导航栏_如何使用pxcook进行测量尺寸?-CSDN博客

本文链接：https://blog.csdn.net/csdnlirui/article/details/122537963

png用设计左侧尺子量尺寸，查颜色用吸管

psd用开发模式

盒子模型

盒子由内容区域content+内边距padding+边框border+外边距margin。

3.1边框（快捷键bd+tab）

border：1px solid red;

solid实线dashed虚线dotted点线

单向设置 border-left-right-top-bottom。

border会撑大盒子，width和height减去双倍border。

内减模式：box-sizeing:border-box; 不用计算盒子尺寸了。

去掉ul列表序号 ul｛list-style=none;｝

塌陷问题：给父元素加overflow：hidden;

改变行内标签上下位置用line-height;

书写顺序：从外到内，先宽高背景色，放内容，调节内容的位置，控制文字细节

<html>
<head>
<style>
.class1{
  height:40px;
background-color:#fcfcfc;
border-top:3px solid #ff8500;
border-bottom:1px solid #edeef0;

}
.class1 a{
width:77px;
hegiht:40px;
text-align:center;
line-height:40px;
text-decoration:none;
display:inline-block;
font-size:11px;
}
.class1 a:hover{
color:#ff8400;
background-color:#edeef0;
}

 
</style>
</head>
<body>
<div class="class1">
  <a href="#">设为首页</a>
  <a href="#">手机新浪网</a>
  <select>
    <option>移动客户端</option>
    <option><a href="#">新浪微博</a></option>
	<option><a href="#">新浪新闻</a></option>
	<option><a href="#">新浪财经</a></option>
  </select>
</div>

</body>
</html>