在本次的html5與css3課程大作業中，我所編寫的代碼主要是基于一個網頁的布局與設計，并在其中應用了html5和css3的相關知識。下面是其中一部分精選代碼。

/* css樣式代碼部分 */
.header {
display: flex;
align-items: center;
justify-content: space-between;
background-color: #333;
color: #fff;
padding: 20px;
}
.menu {
display: flex;
justify-content: flex-end;
align-items: center;
gap: 20px;
}
.menu a {
color: #fff;
font-size: 1.2rem;
text-decoration: none;
}
.container {
max-width: 1200px;
margin: 0 auto;
padding: 20px;
}
.news-section {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
gap: 20px;
}
.news-card {
border: 1px solid #ccc;
border-radius: 5px;
overflow: hidden;
}
.news-card img {
width: 100%;
height: auto;
}
.news-card p {
font-size: 1.2rem;
margin: 10px;
}

以上的代碼中，header標簽表示網頁的頭部區域，采用了flex布局，并設置了背景顏色、字體顏色、內邊距等。而menu是頭部區域里的導航菜單，在此采用了flex的另一種布局方式，并設置了菜單項之間的間隔、文字顏色、字體大小等。container是網頁的主要容器，在此設置了最大寬度、居中、內邊距等樣式。

接下來的部分代碼是用于新聞板塊的展示，整個區域采用了grid布局，循環放置每個新聞卡片，卡片本身設置了邊框、圓角、溢出隱藏等樣式。在卡片中的圖片和文字也有相應的樣式設置。

網站標題
最新新聞
第一條新聞的標題
第一條新聞的內容簡介
第二條新聞的標題
第二條新聞的內容簡介

最后是在html頁面中的代碼部分，其中主要有頭部、容器、新聞板塊三個部分。在頭部中，h1標簽表示網站的標題，而nav中的a標簽則表示菜單項。在容器中，h2標簽表示新聞板塊的標題，news-section容器則是新聞卡片的整體布局。最后，news-card是每個新聞卡片的局部布局。