前端入门：HTML（列表和边框案例）

1.列表知识：

list-style-position有两个值，分别是inside，outside，分别表示在标签里面和在标签外面。

2.案例：

源代码：

html:

   

   

       

• 新手前端适合买什么笔记本？

       

• 前端面试如何谈高薪？

       

• 大厂前端招聘中的内幕

       

• 28岁转前端来得及吗？

       

• 女生前端好找工作吗？

   

css:

* {

    padding:0;

    margin:0;

}

.bigBox {

    width: 500px;

    height: 310px;

    background-color:pink ;

    margin-top: 30px;

    margin-left: 30px;

}

.bigBox>div {

    height: 60px;

    font-size: 20px;

    color: #ff6347;

    border-top: 2px solid #4e6ef2;

    border-bottom: 1px solid #4e6ef2;

    line-height: 60px;

    font-weight: bold;

    text-indent: 1em;

}

ul {

    list-style: inside;

    font-size: 18px;

    line-height: 35px;

    margin-top: 30px;

}

ul>li:hover {

    color:blue;

    text-decoration: underline;

}