第一次写一个网页遇到的一些问题

第一次写一个网页遇到的一些问题

1. 页面布局的时候设置一个统一的container（版心）的css样式，width="1200px" margin:0px auto;

2. 对于页面的同一行的导航栏布局一般都是通过浮动

   1. 浮动元素本身的注意点：
      1. 对于浮动元素而言，它是紧贴父元素左侧顶部或者右侧顶部布局的
      2. 不管是什么元素，只要浮动后都会变成浮动元素，可以设置宽高
      3. 一般我们需要主动设置它的宽高，不然它的宽高依据它的内容（这里就会涉及到父元素中设置的行高，会影响到它的高度，这里需要注意）
      4. 一般对于导航栏，设置行高和整个nav的高度一致（保证了其内部的行内元素和行内块元素的文本垂直居中），一般对于行内块元素元素本身我们会再设置一下vertical-align="middle"。

3. 对于那种 logo 与 搜索栏和按钮那种布局：

   • 可以使用浮动加外边距实现
     • 对于同一行的搜索框与按钮，我们需要注意这两个行内块之间会有个空格，这是由于代码换行生成的
       • 可以设置父元素的行高为0解决，记得后面将两个行内元素的行高设置回来
   • 也可以使用绝对定位来实现
     • 这种适合布局不复杂的情况

4. 居中

   • 想要文本水平居中（行内块元素和行内元素）就设置 text-align:center
   • 想要为超链接设置边框时，因为超链接是行内元素，我们需要将a标签转换为行内块元素，然后设置宽高和边框即可
   • 当我们为超链接设置了边框时，点击文字变色，边框也会变色。