CSS实例【一】

最新推荐文章于 2023-01-08 22:44:08 发布

虾尾丸子

最新推荐文章于 2023-01-08 22:44:08 发布

阅读量168

点赞数

分类专栏：前端文章标签： css

本文链接：https://blog.csdn.net/yogurt_sweets/article/details/117998459

版权

前端专栏收录该内容

24 篇文章 0 订阅

订阅专栏

哈喽，html更完，开始更css的内容了，端午节回来写的马上更新：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<style>
		h1{
			background-color: aquamarine;
			color: #2756fe;
		}
		p{
			background-color: #ff9a49;
			
		}
		p.ex{
			color:rgb(0,0,255);
		}
		div{
			background-color: #ca5bfb;
		}
		body{
				background-color:#acadaf;
				background-image: url(img1.jpeg);
				background-repeat: no-repeat;
				background-position: right top; 
				margin-right: 200px;
				background-size: 180px 150px;
				background-attachment: fixed;
				
				color: aliceblue;
			}
			.container{
				text-align: center;
			}
			.center_div{
				border: 1px solid #ffb88d;
				margin-left: auto;
				margin-right: auto;
				width: 90%;
				background-color: antiquewhite;
				text-align:left;
				padding: 8px;
				color: #ff0000;
			}
		</style>
	</head>
	<body>
		<h1>My CSS web</h1>
		<div class="container">我是div
			<p>我是段落</p>
			<div class="center_div">我是用的第二个类，我是一个大框框，可以写好多内容</div>
			我是div
		</div>
		<p class="ex">hello world!margin-right属性是设置文本右边框空白距离，<br>控制img大小和position位置可以使得图片与文字分离，<br>repeat设置图片是否重复</p>
		<p>background-attachment控制img，当页面向下滚动的时候，是否固定</p>
		<p>background-attachment控制img，当页面向下滚动的时候，是否固定</p>
		<p>background-attachment控制img，当页面向下滚动的时候，是否固定</p>
		<p>background-attachment控制img，当页面向下滚动的时候，是否固定</p>
		<p>background-attachment控制img，当页面向下滚动的时候，是否固定</p>
		<p>background-attachment控制img，当页面向下滚动的时候，是否固定</p>
		<p>background-attachment控制img，当页面向下滚动的时候，是否固定</p>
		<p>background-attachment控制img，当页面向下滚动的时候，是否固定</p>
		<p>background-attachment控制img，当页面向下滚动的时候，是否固定</p>
		<p>background-attachment控制img，当页面向下滚动的时候，是否固定</p>
		<p>background-attachment控制img，当页面向下滚动的时候，是否固定</p>
	</body>
</html>

源码还是放在资源里，准备免积分下载了～
还是老样子，喜欢的小可爱麻烦点赞评论哟，一起鼓励，一起进步～

虾尾丸子

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
CSS实例【一】

哈喽，html更完，开始更css的内容了，端午节回来写的马上更新：<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style> h1{ background-color: aquamarine; color: #2756fe; } p{ background-color: #ff9a49;
复制链接

扫一扫