1. navigation bar coding ul> li
.wrapper {
padding: 0; / * the beginning start page comes 16pxmargin * /
margin: 0;
width: 300px; / * start a parent width 300px * /
list-style: none; / * Clear preceding dot format * /
display: flex; / * * of the sub-elements arranged laterally /
justify-content: space-around; / * flex with the attributes of the sub-element average pitch * / / * equal intervals on both sides of each item * /
}
at the {
font-weight: bold; / * bold font * /
height: 10px; /*li 高 10px*/
line-height: 10px; / * li as heel row * /
padding: 15px; / * like a computer screen as the thickness of the package elements * /
}
li: hover {/ * put up when the mouse * /
border-radius: 20px; / * * border circle arc /
background: black; / * Font color * /
color: white; / * Font color * /
}
2.
div p.test {
width: 300px;
height: 36px;
line-height: 36px;
color: white;
text-align: center;
background: #f46;
border-radius: 6px;
}
.chat>p {
width: 0px;
height: 0px;
border-top: 10px solid transparent;
border-right: 10px solid #f46;
border-bottom: 10px solid transparent;
border-left: 10px solid transparent;
}
div.chat {
display: flex;
align-items: center;
margin-left: 100px;
}
Anchor:
