2020.11.05-前端第四天学习日记-css

2020.11.05

今天是学习前端的第四天，上午对昨天的form表单学习进行了补充，补充了下拉选择框和一个边框样式fieldset的应用。
form表单由select下拉列表嵌套option列表选项组成，主要应用于网站个人信息的填写，里面的属性值有size：可以设置显示几个列表选项，mutiple：可以进行多重选择。
fieldset运用在form表单里，主要是为form表单添加边框，可以用legend设置标题，效果如下：

---

下午就开始了css的学习，html定义网页的内容，css就是为网页添加各种样式，首先学习了css的四种连接方式，第一种是**行内式**，一般不使用，不便于维护；第二种是**内嵌式**，可作为代码较少的网页使用；第三种是**外链式**，是经常使用的链接方式，适合代码较多的网页，便于修改；第四种是**导入式**，一般也不使用。
css的格式为：
选择器{属性：属性值；}
我们下面又对选择器进行了学习，第一种是**标签选择器**，直接选择要修改的标签；第二种是**id选择器**，给要修改的标签添加id，css格式为#id{}，id只能设置一个；第三种是**class**，给要修改的标签添加class，css格式为.class{}，class可以设置多个。
学完了三种链接方式，又学习了几种简单的css设置字体，背景颜色，等的方法，代码如下：

#p2{
    color: gray;
    font-size: 32px;
    font-family: "SimSun";
}
div{
    background-color: pink;
    height: 250px;
    border:2px dashed #ff0000;
    margin-top: 10px;
}

通过今天的学习，对css的学习有了一个最基本的认识，要多加练习，为之后的学习打下坚实的基础。
今日练习：

<style>
    *{
        font-family: "微软雅黑";
        font-size: 13px;
    }
    p{
        background-color: yellow;
        color:blue;
    }
    h1{
        background-color: yellow;
        color:blue;
    }
    #Orz{
        background-color: green;
    }
    .T_T{
        color:green;
        text-align: center;
    }
</style>

---