css 相同的css屬性
CSS | 訂單屬性 (CSS | order Property)
Introduction:
介紹：
Web development is an ever-growing field that would never find its end, therefore it is equally necessary to learn new ways to deal with the elements of the web page or web development. Dealing with texts, containers and various such elements need their own set of properties and values. Hence while developing or creating a web page or website on must keep looking for new and innovative ways to deal with the elements.
Web開發是一個不斷發展的領域，永遠不會消失，因此同樣有必要學習處理Web頁面或Web開發元素的新方法。 處理文本，容器和各種此類元素需要它們自己的一組屬性和值。 因此，在開發或創建網頁或網站時，必須不斷尋找新的創新方式來處理這些要素。
This section is about a property that is widely used while using flexible items in a web page. How to deal with those items to make the web page or website more responsive will be discussed in this article. So buckle up and get ready for a lot of knowledge is coming right up! The property in the discussion here today is order Property in CSS.
本部分是關于在網頁中使用靈活項時廣泛使用的屬性。 本文將討論如何處理這些項目以使網頁或網站更具響應性。 因此，請系好安全帶，為即將來臨的大量知識做好準備！ 今天在這里討論的屬性是CSS中的order屬性 。
Elaboration:
詳細說明：
The order property in CSS is used to give the order of each flexible item about other flexible items in the flexible container. If the item is not flexible the order property is of no use.
CSS中的order屬性用于提供有關彈性容器中其他彈性項目的每個彈性項目的順序。 如果商品不靈活，那么order屬性將毫無用處。
Syntax:
句法：
Element{
order : number|initial|inherit;
}
The order property does not take up much of the values, the only value that it takes is known as number. Let us understand this value much more clearly.
order屬性不會占用太多的值，它獲取的唯一值稱為number 。 讓我們更加清楚地了解這一價值。
訂單號 (order : number)
The number value of the property as the name itself suggests is used for using assigning numbers or orders to the flexible item, so let us move further with a much more formal definition.
顧名思義，該屬性的數字值用于將數字或訂單分配給該靈活項目，因此讓我們進一步使用更正式的定義。
This value of the order property is used to give the order of flexible items and gives numbers corresponding to every item according to the user's requirement.
order屬性的此值用于給出靈活商品的訂單，并根據用戶要求給出與每個商品相對應的數字。
The default value of this value is 0.
此值的默認值為0。
Syntax:
句法：
Element{
order : number;
}
Example:
例：
<!DOCTYPE html>
<html>
<head>
<style>
#main {
width: 400px;
height: 150px;
border: 1px solid #c3c3c3;
display: flex;
}
#main div {
width: 100px;
height: 100px;
}
div#DIV1 {
order: 2;
}
div#DIV2 {
order: 4;
}
div#DIV3 {
order: 3;
}
div#DIV4 {
order: 1;
}
</style>
</head>
<body>
<h1>The order Property</h1>
<div id="main">
<div style="background-color:green;" id="DIV1"></div>
<div style="background-color:red;" id="DIV2"></div>
<div style="background-color:pink;" id="DIV3"></div>
<div style="background-color:blue;" id="DIV4"></div>
</div>
</body>
</html>
Output
輸出量
In the above example, it can be easily seen that the order of each item is given and hence the item is displayed in its corresponding order.
在上面的示例中，可以很容易地看出每個項目的順序已給出，因此該項目以其相應的順序顯示。
Ending note:
結束語：
Although this property may sound a bit confusing if implemented properly and wisely then this property will surely prove to be a very strong asset for the development and creation of a very responsive web page.
盡管如果正確，明智地實現此屬性可能聽起來有些混亂，但是對于開發和創建響應速度非常快的網頁，該屬性無疑將被證明是非常強大的資產。
However, dealing with flexible items can become quite tricky but we all are familiar with the phrase-practice makes a man perfect! So go on grab your systems and start coding!
但是，處理柔性物品可能會變得非常棘手，但是我們都熟悉短語練習，使一個人變得完美！ 因此，繼續掌握您的系統并開始編碼！
翻譯自: https://www.includehelp.com/code-snippets/the-order-property-in-css.aspx
css 相同的css屬性
