第一个css样式

最新推荐文章于 2024-03-30 14:12:27 发布

博文你可长点心吧

最新推荐文章于 2024-03-30 14:12:27 发布

阅读量663

点赞数 1

分类专栏： css 文章标签：标签 html

本文链接：https://blog.csdn.net/u010993335/article/details/53887737

版权

css 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

标签（空格分隔）： css

本文介绍如何声明以及使用css
1. 内联样式
直接在标签上声明就可以使用

<div style="height: 100px;width: 100px;background-color: #369;">内联样式</div>

2. 使用style标签
通常是在<head></head>标签内使用<style></style>来表示其内部是用来表示样式相关的代码，
通过不同的css选择器给相应的元素赋予不同的样式，比较常用的有.类选择器和#id选择器

<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <style>
        .class{
            height: 100px;
            width: 100px;
            background-color: #963;
        }
        #id{
            height: 100px;
            width: 100px;
            background-color: #936;
        }
    </style>
</head>
<body>
    <div class="class">style-class</div>
    <div class="id">style-id</div>
</body>

3. 通过link外部引用
link可以跨域引用，除了使用本地的文件，还可以使用远程文件
通常会将<link></link>标签放到<head></head>内

<link href="//cdn.bootcss.com/bootstrap/4.0.0-alpha.5/css/bootstrap-flex.css" rel="stylesheet">

这样就可以直接使用bootstrap内定义好的样式了
4. 通过@import引用
@import url('输入css地址')
不建议这样使用，因为当html加载完之后才会加载@import的。在IE下也会非常慢，大家可以无视@import了
demo地址
必读扩展知识
css选择器
 css权重

博文你可长点心吧

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
第一个css样式

标签（空格分隔）： css本文介绍如何声明以及使用css 1. 内联样式直接在标签上声明就可以使用<div style="height: 100px;width: 100px;background-color: #369;">内联样式</div>使用style标签通常是在<head></head>标签内使用<style></style>来表示其内部是用来表示样式相关的代码，通过不同的
复制链接

扫一扫

专栏目录