first commit

历届学生/18课程/class18/项目/上课项目/在包河H5静态页面/css/clear.css

@@ -0,0 +1,48 @@
+/* 清除浏览器默认样式 */
+
+html {
+    font-size: 20px;
+}
+
+@media only screen and (min-width: 400px) {
+    html {
+        font-size: 21.33333333px !important;
+    }
+}
+
+@media only screen and (min-width: 414px) {
+    html {
+        font-size: 22.08px !important;
+    }
+}
+
+@media only screen and (min-width: 480px) {
+    html {
+        font-size: 25.6px !important;
+    }
+}
+
+@media only screen and (min-width: 767px) {
+    html {
+        font-size: 40.96px !important;
+    }
+}
+
+body,
+ul,
+li,
+p,
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+    margin: 0;
+    padding: 0;
+    list-style: none;
+}
+
+a {
+    text-decoration: none;
+}

历届学生/18课程/class18/项目/上课项目/在包河H5静态页面/css/index.css

@@ -0,0 +1,220 @@
+.header {
+    height: 2.5rem;
+    background-color: #000000;
+    opacity: 0.7;
+    position: fixed;
+    width: 100%;
+    top: 0;
+    left: 0;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    padding-left: 0.65rem;
+    padding-right: 1rem;
+    box-sizing: border-box;
+    z-index: 999999;
+}
+
+.header img {
+    height: 1.625rem;
+}
+
+.header .open {
+    width: 3.6rem;
+    height: 1.3rem;
+    background-color: #d0302c;
+    border-radius: 0.2rem;
+    font-size: 0.6rem;
+    line-height: 1.175rem;
+    color: #ffffff;
+    text-align: center;
+}
+
+.video {
+    width: 100%;
+    margin-top: 2.5rem;
+}
+
+.video_info {
+    position: relative;
+    padding-bottom: 1.275rem;
+}
+
+.video_info h2 {
+    font-size: 0.9rem;
+    line-height: 1.425rem;
+    color: #333333;
+    margin-top: 1.475rem;
+    margin-bottom: 0.75rem;
+}
+
+.video_info .time {
+    font-size: 0.6rem;
+    color: #999999;
+    margin-bottom: 0.675rem;
+}
+
+.video_info .video_action {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    height: 1rem;
+}
+
+.action_left img {
+    width: 0.7rem;
+}
+
+.action_left span,
+.action_right span {
+    font-size: 0.6rem;
+    color: #999;
+}
+
+.action_right img {
+    width: 0.425rem;
+    margin-left: 0.275rem;
+}
+
+.action_left .like {
+    margin-right: 1.5rem;
+}
+
+.action_left .like img {
+    margin-right: 0.2rem;
+}
+
+.action_left .good img {
+    margin-right: 0.25rem;
+}
+
+.recommend {
+    position: relative;
+    padding-bottom: 0.975rem;
+}
+
+.recommend_list {
+    overflow-x: scroll;
+}
+
+.recommend h2,
+.comment h2 {
+    height: 2.5rem;
+    background-color: #ffffff;
+    line-height: 2.5rem;
+    font-size: 0.8rem;
+    color: #333333;
+}
+
+.recommend_list li {
+    width: 6.85rem;
+    margin-right: 0.275rem;
+    flex-shrink: 0;
+}
+
+.recommend_list li .img {
+    height: 3.9rem;
+    position: relative;
+}
+
+.recommend_list li .img img {
+    width: 100%;
+    height: 100%;
+}
+
+.recommend_list li .img .time {
+    font-size: 0.55rem;
+    color: #ffffff;
+    position: absolute;
+    right: 0.35rem;
+    bottom: 0.325rem;
+}
+
+.recommend_list li p {
+    font-size: 0.7rem;
+    line-height: 1.175rem;
+    color: #333333;
+    margin-top: 0.6rem;
+}
+
+.comment {
+    margin-bottom: 4.2rem;
+}
+
+.comment_list {}
+
+.comment_item {
+    margin-bottom: 1rem;
+}
+
+.item_top {
+    display: flex;
+    justify-content: space-between;
+}
+
+.item_top .item_top_left {
+    display: flex;
+}
+
+.item_top_left img {
+    width: 1.75rem;
+    height: 1.75rem;
+    border-radius: 100%;
+    margin-right: 0.5rem;
+}
+
+.item_top_left p {
+    font-size: 0.7rem;
+    color: #333333;
+}
+
+.item_top_left span {
+    font-size: 0.5rem;
+    color: #999999;
+}
+
+.item_top .item_top_right {
+    display: flex;
+    align-items: center;
+}
+
+.item_top_right img {
+    width: 0.65rem;
+    height: 0.675rem;
+    margin-right: 0.25rem;
+}
+
+.item_top_right span {
+    font-size: 0.6rem;
+    color: #999999;
+}
+
+.item_text {
+    font-size: 0.7rem;
+    line-height: 1.05rem;
+    color: #333333;
+    width: 14.95rem;
+    margin-left: 2.225rem;
+    margin-top: 0.95rem;
+}
+
+.top_left_text {
+    display: flex;
+    flex-direction: column;
+}
+
+.open_comment {
+    position: fixed;
+    width: 17.55rem;
+    height: 2.2rem;
+    border-radius: 0.2rem;
+    border: solid 0.05rem #d0302c;
+    font-size: 0.7rem;
+    color: #d0302c;
+    bottom: 1rem;
+    text-align: center;
+    line-height: 2.2rem;
+    left: 50%;
+    margin-left: calc(-17.55rem / 2);
+    background-color: #fff;
+}

历届学生/18课程/class18/项目/上课项目/在包河H5静态页面/css/public.css

@@ -0,0 +1,27 @@
+/* 公共css */
+.padding {
+    padding-left: 0.575rem;
+    padding-right: 0.6rem;
+}
+
+.flex {
+    display: flex;
+}
+.flex-align-items {
+    display: flex;
+    align-items: center;
+}
+.active {
+    color: #d0302c !important;
+}
+
+.bottom-line::after {
+    content: "";
+    position: absolute;
+    width: 100%;
+    left: 0;
+    bottom: 0;
+    height: 1px;
+    background: #ededed;
+    transform: scaleY(0.5);
+}