2.css基础

最新推荐文章于 2024-08-10 21:02:05 发布

RedeeMi

最新推荐文章于 2024-08-10 21:02:05 发布

阅读量50

点赞数

分类专栏：大一暑假demo 文章标签： css 前端

本文链接：https://blog.csdn.net/qq_52316911/article/details/109651719

版权

大一暑假demo 专栏收录该内容

10 篇文章 0 订阅

订阅专栏

css的三种引用方式
1.直接在html中的head标签中写style标签，在style标签中写css样式

<head>
    <style>
      /*css样式*/
    </style>
</head>

2.html中的div里修改格式

<div style="width:100px; height: 100px; background-color: red;">
  我是一个div
</div>

3.文件下新建css目录，html中通过link rel引用
只修改href后的路径(引用css目录下的index.css)

<div>
 我是div
</div>
div{
width: 100px;
height: 100px;
background-color:red;
}

4.三种选择器
(1)派生选择器:直接使用div和span，区分度不高

<div>
	我是div
</div>
		
<span>
	我是span				
</span>

div{
width: 100px;
height: 100px;
background-color:red;
}

span{
	width: 100px;
	height: 50px;
	background-color:green;
}

(2)id选择器，用#

<div id="a">
	大写的A
</div>
		
<div id="b">
        大写的B 
</div>

#a{
	background-color: grey;
}
#b{
	background-color: black;
}

div是块，id选择器可以定义一切包含行

<h2 id="c">江苏徐州</h2>
#c{
background-color: pink;
}

(3)class类选择器，用.

<p class="d">
	啊啊aaaaaaaaaaaaaaaaaa
</p>

.d{
	font-size: 50px;
}

broder边框

border-style:solid ;
border-width :5px; 边框距离
broder:#000000 dashed 5px;

在这里插入图片描述

RedeeMi

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
2.css基础

css的三种引用方式1.直接在html中的head标签中写style标签，在style标签中写css样式<head> <style> /*css样式*/ </style></head>2.html中的div里修改格式<div style="width:100px; height: 100px; background-color: red;"> 我是一个div</div>3.文件下新建cs
复制链接

扫一扫

专栏目录