前端学习2

1.分割线
自己尝试做的时候用的是hr来作为分割线，并设置了渐变效果。
语法：
background: linear-gradient(direction, color-stop1, color-stop2, ...);
培训时讲的是设置图层的top/bottom边框来作为分割线。

2.rgba(r,g,b,a) a代表不透明度，范围为0-1。

3.字体加粗，一般使用font-weight:600;

4.使用F12开发人员工具，调试HTML和CSS。

5.自己做的时候，导航栏的三块元素：logo，餐厅名，导航，无法保持在同一水平线上。Gratia Restaurant总是浮动在最外层。
培训时讲的方法是把导航栏div下，把左右又各分为一个div，分别浮动到左右，将导航栏设置为display：inline-block。
inline，block，inline-block对比：
inline：多个相邻的行内元素会排列在同一行里，直到一行排列不下，才会新换一行，其宽度随元素的内容而变化。对其设置width,height属性无效，竖直方向上的margin和padding设置无效。
block：独占一行。可设置width和height。设置margin和padding有效。
inline-block：元素既会处于同一行，又可以设置width和height。

6.flex布局
菜单的布局用的是flex

#content{
 display:flex;
 flex-wrap:wrap;
 justify-content:center;
 width:90%;
 margin-top:50px;
 margin:auto;
}

属性：
flex-direction，默认水平方向从左到右
flex-wrap，默认nowrap不换行，wrap换行且第二行在下面
justify-content，在主轴上的对齐方式

7.不允许用户复制文本和拖动图片：

body{
	ondragstart="return false";
}