在前端開發(fā)中，瀏覽器伸縮（flex）布局已經(jīng)越來越普及，因?yàn)樗梢允刮覀兏菀椎毓芾聿季趾涂刂圃氐奈恢煤痛笮　g覽器伸縮的核心是flex屬性，我們可以使用它來定義容器（父元素）和元素（子元素）的伸縮方式。

下面是一個(gè)簡(jiǎn)單的例子：

.container {
display: flex;
}
.item {
flex: 1;
}

首先，我們將容器（.container）設(shè)置為flex布局。如此一來，容器內(nèi)的所有元素都將采用伸縮布局。其次，把所有子元素（.item）的flex屬性設(shè)置為1。這意味著所有子元素將等分容器的寬度。

我們還可以更靈活地使用flex屬性。例如，我們可以使用一個(gè)值來指定一個(gè)元素在容器中的比例。下面是一個(gè)例子：

.container {
display: flex;
}
.item1 {
flex: 1;
}
.item2 {
flex: 2;
}

這里，我們將兩個(gè)子元素的flex屬性設(shè)置為1和2。這意味著第二個(gè)元素（.item2）的寬度將是第一個(gè)元素（.item1）的兩倍。

除了使用數(shù)字，我們還可以使用一些關(guān)鍵字來設(shè)置元素的伸縮和縮放方式。例如，我們可以使用“flex-start”，“center”和“flex-end”來指定元素在容器中的水平對(duì)齊方式：

.container {
display: flex;
justify-content: space-between;
}
.item1 {
align-self: flex-start;
}
.item2 {
align-self: center;
}
.item3 {
align-self: flex-end;
}

在這個(gè)例子中，我們將容器設(shè)置為space-between對(duì)齊方式，這會(huì)在容器中均勻分布子元素。然后，我們使用“align-self”屬性將每個(gè)子元素的垂直對(duì)齊方式設(shè)置為“flex-start”，“center”和“flex-end”。

總之，flex布局是一種非常靈活的方式來管理布局和控制元素的位置和大小。我們可以使用flex屬性來指定元素在容器中的比例、水平對(duì)齊方式和垂直對(duì)齊方式。