【学习前端第六课】选择器使用

本节内容:标签,id,类,分组,后代,子代,相邻,兄弟、伪类选择器使用
利用之前在标签案例中制作过的诗句,将其中的样式替换成通过选择器赋予的方式来进行完成
CSS的基础学习可以在菜鸟教程上看,官网:菜鸟教程 https://www.runoob.com/
还有另外一个学习前端的网站:W3Schools
都是老师推荐的,我经常用的是菜鸟,都很齐全,强推!
这是一个简单样例代码

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<style>
			h1,h2,p{
				text-align: center;
			}
			hr{
				width:300px;
				background-color: red;
				height:6px;
			}
			.p1{
				font-weight: bold;
			}
			.p1>span{
				font-style: italic;
			}
			#s1{
				color:red;
			}
			.p3{
				font-size:30px;
			}
			.p3 span{
				font-family: "楷体";
			}
			.p3+p span{
				text-decoration: line-through;
			}
			.p1~.p3{
				text-decoration: underline;
			}
			p:nth-of-type(2n-1){
				color:orange;
			}
		</style>
	</head>
	<body>
		<h1>《题沈隐侯八咏楼(梁日东阳守)》</h1>
		<h2>崔颢</h2>
		<hr>
		<p class="p1"><span>梁日东阳守</span>,为楼望越中。</p>
		<p><span id="s1">绿窗明月在</span>,青史古人空。</p>
		<p class="p3">江静闻山狖,<span>川长数塞鸿。</span></p>
		<p>登临白云晚,<span>留恨此遗风。</span></p>
	</body>
</html>
  • 10
    点赞
  • 7
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值