#####一. html塊級元素
h1~h6 p address hr(水平分割線) blockquote ul ol table form div br nav footer…
特點：
1.總是從新行開始。
2.高度、行高以及內外邊距都是可控制的。
3.寬度沒有設定預設為100%。
4.它可以容納內聯元素和其他塊元素。
#####行內元素
em i abbr strong span a img input textarea b(加粗） …
特點
1.和其他元素都在同一行上。
2.高度、行高以及頂、底邊距都是不可控制的。
3.寬度就是內容的寬度，不可改變。
4.內聯元素只能容納文字和其他內聯元素。
######內聯塊級元素（display:inline-block）
特點

 *{color: red};

5.後代選擇器

body h1 {font-size: 200%;}

6.相鄰兄弟選擇器

table + p { margin-top: 2.5em;} /*選擇所有緊跟在table元素與之後的p元素*/
h1 + * {margin-top: 0;}

7.子選擇器

div > p {color: red;} /*選擇作為div元素子元素的所有p元素*/
ul > li {font-weight: bold;}
 

8.屬性選擇器

1.簡單屬性選擇器
a[target]
{ 
background-color:yellow;
}/*選擇所有帶有target屬性的 <a>元素*/
2.具體屬性選擇器
a[target=_blank]
{ 
background-color:yellow;
}/*選擇所有使用target="_blank"的a元素*/
3.部分屬性選擇器
[title~=flower]
{ 
background-color:yellow;
}/*選擇標題屬性包含單詞"flower"的所有元素 ~=可用於任何屬性*/
4.語言屬性選擇器
[lang|=en]
{ 
background-color:yellow;
} /*選擇一個lang屬性的起始值="en"的所有元素*/
5.開始子串屬性值選擇器
模式 element[attr^="substring"]
div[class^="test"]
{
background:#ffff00;
} /*class屬性值以"test"開頭的所有div元素的背景顏色*/
6.結束子串屬性值選擇器
element[attr$="substring"]
7.任意子串屬性值選擇器
element[attr*="substring"]

 

9.偽類選擇器

:link
:visited
:active
:hover
:focus
p:first-child /作為某元素第一個子元素的所有p元素/
…

10.偽元素選擇器

:first-letter
:first-line
:before 在元素前插入內容
#####四、盒子模型

#####五.水平居中的方法

body{margin:0； padding:0} //清除預設樣式
1. .center {
margin: o auto;// 上下 左右
text-align: center;
} /*可以給其設定一個寬度*/
2.通過display:flex實現CSS水平居中的原理
父元素display:flex;flex-direction:column;
子元素align-self:center;
.par {
            display: flex;
            flex-direction: column;
        }/*父元素*/
 .son{
            align-self: center; 
        }/*子元素*/
3. 在父元素和子元素寬度都確定的情況下，可以使用該方法，需要考慮子元素的寬度（下面所示方法，子元素寬度為200px。
        .par {
            width: 1000px;
            display: table-cell;
        }
        .son {
            margin-left: 400px;/*50%*/
        }
4.與3大同小異，父、子元素須確定的寬度
使用時，父元素position:absolute，子元素給剩餘寬度一半的margin-left。
5.適用於子元素寬度不確定的情況下
需要配合“margin: 0 auto; text-align: center”使用
  .son {
            border: 1px solid black;
            width: fit-content;
            margin: 0 auto;
            text-align: center;
        }
6.已知寬度,通過設定position:absolute,margin-left為寬度的負一半
.par{position:relative;}
.son{position:absolute;left:50%;width:150px;margin-left:-75px;}

垂直居中

1.單行文字水平居中
將line-height和height設定為同樣的數值。
<span style="font-size:14px;"><div style="height:500px;line-height:500px;">
    我是垂直居中的
</div></span>
2.利用vertical-align垂直居中
設定父級元素為display:table-cell以及vertical-align:middle,：設定為display:table-cell的元素，不能使用浮動或者定位
.parent {
            height: 500px;
            display: table-cell;
            vertical-align: middle;
        }
3.  可以將新增的元素高度設定的和父級元素一樣高，寬度為0，並且同樣設定vertical-middle:middle以及display:inline-block; 由於兩個元素之間的空白會被解析，因此需要在父級設定font-size:0px;在子級又將font-size設定回來。    
 .parent{
            height:300px;
            font-size:0px;
        }
 .child{
            font-size:14px;
            display:inline-block;
            vertical-align:middle;
        }
 .space{
            display:inline-block;
            vertical-align:middle;
            height:100%;
            width:0px;
        }
4.通過絕對定位
   .parent{
            height:100px;
            position:relative;
        }
   .child{
            position: absolute;
            top: 50%;
            transform: translateY(-50%);
        }
5.通過flex
（1）、在伸縮容器上設定側軸對齊方式align-items: center
.parent{  
  height:100px;
  display: flex;  
  align-items: center;  
}
(2)在伸縮專案上設定margin: auto 0
.parent{  
height:10px:
display: flex;  
}  
.child{  
margin: auto 0;  
}  
6.
display:
top:50%;

#####六.js基本資料型別（5種）
undefined null number boolean
string
object（一種複雜的資料型別）
引用資料型別：array object function
#####七.jquery實現滑鼠放到一張圖片上顯示圖片資訊，挪開不顯示

$(document).ready(function () {

            $("img").mouseout(function () {
                $("img").hide();
            });
            setInterval(function () {
                $("img").show();
            },6000);

        });

#####八.求1-999的迴文數

#include<stdio.h>
int main(){
	int i,m,sum=0;
	for(i=1;i<1000;i++)
	{
		m=i;
		sum=0;
		//數字反向 
		while(m)
		{
			sum=sum*10+m%10;
			m/=10;
		}
		if(sum == i)
		{
			printf("%d ",sum);
		}
	}
	return 0;

}

#####九.快排

//c語言
#include <stdio.h>
#define N 10
void quicksort(int a[],int low,int high);
int split(int a[],int low,int high);
int main()
{
	int a[N],i;
	for(i=0;i<N;i++)
	scanf("%d",&a[i]);
	quicksort(a,0,N-1);
	for(i=0;i<N;i++)
	printf("%d ",a[i]);
	return 0;
}
void quicksort(int a[],int low,int high)
{
	int middle;
	if(low>=high) return;
	middle=split(a,low,high);
	quicksort(a,low,middle-1);
	quicksort(a,middle+1,high);
}
int split(int a[],int low,int high)
{
	int split_element=a[low];
	for(;;){
	while(low<high&&split_element<=a[high])
	high--;
	if(low>=high) break;
	a[low++]=a[high];
	
	while(low<high&&a[low]<=split_element)
	low++;
	if(low>=high) break;
	a[high--]=a[low]; 
}
a[high]=split_element;
return high;
}

//javascript
function quick_sort(arr) {　　
    if (arr.length <= 1) {
        return arr;
    }　　
    var middle = Math.floor(arr.length / 2);　　
    var pivot = arr.splice(middle, 1)[0];　　
    var low = [];　　
    var high = [];　　
    for (var i = 0; i < arr.length; i++) {　　　　
        if (arr[i] < pivot) {　　　　　　
            low.push(arr[i]);　　　　
        } else {　　　　　　
            high.push(arr[i]);　　　　
        }　　
    }　　
    return quickSort(low).concat([middleValue], quickSort(high));
}

var arr = [6,4,5,2,7];
quick_sort(arr);  // [2,4,5,6,7]