HTML与CSS样式实践指南-优快云博客

本文链接：https://blog.youkuaiyun.com/weixin_45807622/article/details/108889326

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
		<!--内部样式表-->
		<style type="text/css">
			div{
				width: 100px;
				height: 100px;
				background-color: green;
			}
			body{
				background-image: url(img/HBuilder.png);
				/*background-repeat背景重复 repeat-x：第一行平铺 repeat-y 纵向平铺 repeat ：x y都平铺  no-repeat:禁止平铺*/
				background-repeat: no-repeat;
				/*background-attachment:背景的附加方式 scroll更随内容一起滑动  fixed:固定 */
				background-attachment: fixed;
				/*background-position:背景图片的位置  center居中  top页面上方居中位 buttom:页面下方*/
				background-position:top;
				/*背景图片拉升*/
				background-size: 100%;
			}
			p{
				font-family: "微软雅黑","楷体",宋体";;
				font-size:2 em;
				font-weight: bolder ;
				/*font-weight:100- 900 bold  bolder lighter*/
				font-style: oblique;
				/*font-style字体样式: oblique*/
			}
		</style>
		
		<!--外部样式表-->
		<link rel="stylesheet" type="text/css" href="css/my.css"/>
	</head>
	<body>
		<!--1.行内样式表-->
		<div id="div1" style="width: 100px;height: 100px;background-color: red;">
			
		</div>
		
		<div id="div2">
			
		</div> 
		
		<!--1.英文单词-->
		<!--2.#6位16进制的颜色值-->
		<!--3.rgb颜色0-255-->
		<!--4.rgb（）alpha透明度0-1-->
		<p style="color: #B72424;"> 人有悲欢离合，月有阴晴圆缺</p>
		<p style="color:rgb(100,200,20);"> 人有悲欢离合，月有阴晴圆缺</p>
		<p style="color:rgb(100,200,50,0.5); background-color: rosybrown; back"> 人有悲欢离合，月有阴晴圆缺</p>
		
	</body>
</html>

css样式表的初学的知识