css基础

最新推荐文章于 2024-07-12 20:49:16 发布

搬砖老金牛

最新推荐文章于 2024-07-12 20:49:16 发布

阅读量75

点赞数

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

本文链接：https://blog.csdn.net/qq_48968230/article/details/123652076

版权

html和css 专栏收录该内容

12 篇文章 0 订阅

订阅专栏

1、css是什么？

css即“ Cascading Style Sheet（层叠样式表）”，用来控制网页的外观的一种代码语言。

css定义如何显示html元素。

2、css语法

选择符 { 属性：属性值；属性：属性值 }

3、css的引入方式

（1）内部样式表（内链式）：在html页面进行书写，利用style标签在head中书写css语法

（2）外部样式表（外联式）：实现html与css的分离，创建独立的css文档，利用link标签在head 里进行连接。-----采用的最多

（3）行内样式表（内嵌式）：直接书写在标签内部，通过标签的style属性进行使用。

4、css属性

(1)width：元素宽度

(2)height ：元素高度

(3)color ：文字颜色

(4)background-color ：背景颜色

(5)border：边框

实操：

test3.html

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>css基础</title>
		
		<!--css连接方式： 内部样式表 -->
		<style type="text/css">
			p{
				color:#28d083  
			}
		</style>
		
		<!-- css连接方式：外部样式表 -->
		<link rel="stylesheet" href="css/test3.css"/>
		
	</head>
	<body>
		<p>
			好好学习，天天向上
		</p>
		<p>
			好好学习，天天向上
		</p>
		
		<h3>脚踏实地，坚强自信</h3>
		<h3>脚踏实地，坚强自信</h3>
		
		<div id="">  <!-- 模块分类，模块包裹，相当于PS中的打组 -->
			生于中华，吾身之幸
		</div>
			
		<br>
		<div style="color:#28D083; border:3px solid #C92525;">
			床前明月光，疑是地上霜。
		</div>
	</body>
</html>

test3.css

h3{
	color:#c92525;
}

div{
	width:200px;
	height:200px;
	background-color: #A0D6C9;
	border:5px solid #0000FF;
	/* 边框：边框的宽度，边框的类型 solid-实线， 边框的颜色 */
}

运行效果：

搬砖老金牛

关注

0
点赞
踩
0

收藏

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

1、css是什么？css即“ Cascading Style Sheet（层叠样式表）”，用来控制网页的外观的一种代码语言。css定义如何显示html元素。2、css语法选择符 { 属性：属性值；属性：属性值 }3、css的引入方式（1）内部样式表（内链式）：在html页面进行书写，利用style标签在head中书写css语法（2）外部样式表（外联式）：实现html与css的分离，创建独立的css文档，利用link标签在head 里进行连接。-----采用的最多（3）行内样式
复制链接

扫一扫