css的一些用法及html标签的结合使用 week2学习

 1、 在head标签中加入代码<meta charset="utf-8">使网页在别的浏览器以及别的服务器上也可以正常显示；

2、在图片的style中加入代码transform:rotateY(180deg)能够使得图片水平翻转；

3、代码border-radius:10px;能够为边框设置圆角；

4、在设计网页时先将网页分为几大块，再用div层层嵌套。

5、ID选择器和类选择器的区别：

ID选择器只能在文档中使用一次。与类选择器不同，在一个HTML文档中，ID选择器只能使用一次，而且仅一次。而类选择器可以使用多次。

可以使用类选择器词列表方法为一个元素同时设置多个样式。我们可以为一个元素同时设多个样式，但只可以用类选择器的方法实现，ID选择器是不可以的。

6、在CSS中，html中的标签元素大体被分为三种不同的类型：块状元素、内联元素(又叫行内元素)和内联块状元素。

常用的块状元素有：

<div>、<p>、<h1>...<h6>、<ol>、<ul>、<dl>、<table>、<address>、<blockquote> 、<form>

常用的内联元素有：

<a>、<span>、<br>、<i>、<em>、<strong>、<label>、<q>、<var>、<cite>、<code>

常用的内联块状元素有：

<img>、<input>

7、绝对定位：使用可position： absolute可以实现被设置元素相对于浏览器（body）设置定位，用left right就可以相对于浏览器窗口移动。

8、相对定位：position:relative通过left、right、top、bottom属性确定元素在正常文档流中的偏移位置。相对定位完成的过程是首先按static(float)方式生成一个元素(并且元素像层一样浮动了起来)，然后相对于以前的位置移动，移动的方向和幅度由left、right、top、bottom属性确定，偏移前的位置保留不动。

9、固定定位：position:fixed与position:absolute定位类型类似，但它的相对移动的坐标是视图（屏幕内的网页窗口）本身。由于视图本身是固定的，它不会随浏览器窗口的滚动条滚动而变化，除非你在屏幕中移动浏览器窗口的屏幕位置，或改变浏览器窗口的显示大小，因此固定定位的元素会始终位于浏览器窗口内视图的某个位置，不会受文档流动影响，这与background-attachment:fixed;属性功能相同。以下代码可以实现相对于浏览器视图向右移动100px，向下移动50px。并且拖动滚动条时位置固定不变。

10、relative和absolute的组合使用：

使用position:absolute可以实现被设置元素相对于浏览器（body）设置定位position:relative可以相对于其他元素定位。但是必须遵守下面三点规范：

参照定位的元素必须是相对定位元素的前辈元素：

参照定位的元素必须加入position:relative;

定位元素加入position:absolute，便可以使用top、bottom、left、right来进行偏移定位了。