CSS-三种声明方式、写法

最新推荐文章于 2022-11-02 13:53:13 发布

黑小猿

最新推荐文章于 2022-11-02 13:53:13 发布

阅读量1.5k

点赞数

分类专栏：前端

本文链接：https://blog.csdn.net/weixin_43789078/article/details/109519418

版权

前端专栏收录该内容

7 篇文章 0 订阅

订阅专栏

# CSS-三种声明方式、写法

声明方式

行内样式：写在标签属性style=""里面
内部样式：写在<head>标签里面，用标签<style rel="stylesheet" type="text/css"></style>包裹
外部样式：写在外部*.css文档里面，在html文档的<head>标签里面用<link rel="stylesheet" type="text/css" href="外部.css文件路径"/>标签声明

css样式写法：

写在<head>里面

样式优先级：行内样式>class/id样式>全局标签样式

/* 标签全局样式，可以直接写标签名称规定样式表 */
body{
    margin:0;
}
/* "."代表筛选class的意思 */
.style1{
    float: left;
    background-color: #df9696;
    width: 200px;
    height: 200px;
}
/* "#"代表筛选id */
#div_1{
    float: left;
    background-color: #e76590;
    width: 50em;
    height: 20em;
}
/* 这样声明，可以控制所有该类的input子组件的样式 */
.style1 input{
width: 80px;
height: 50px;
}
#div_1 input{
width: 10em;
height: 10em;
}