跟小甲鱼学Web开发笔记04

最新推荐文章于 2024-09-20 15:16:38 发布

敲代码的小朋友

最新推荐文章于 2024-09-20 15:16:38 发布

阅读量203

点赞数 2

文章标签： html css html5

本文链接：https://blog.csdn.net/a392544151/article/details/120682965

版权

这篇博客通过实例介绍了如何使用HTML和CSS让网页变得丰富多彩。内容包括使用`<style>`元素定义样式，链接外部样式表以实现更复杂的美化，以及如何利用`base`元素设定相对URL的解析基准。

摘要由CSDN通过智能技术生成

跟小甲鱼学Web开发笔记04

一只特立独行的猪🐖

在这里插入图片描述
(这个页面是不是非常朴素，那我们有办法“美化”吗？)

让网页看起来更加“丰富多彩”

要让网页更加美观，那这就涉及到了新的元素——<style>

<style>的定义：用于为 HTML 文档定义样式信息。
（style元素可以出现在HTML文档中的各个部分，一个文档可以包含多个style元素）
在这里插入图片描述
举个栗子：

<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<title>style样式的学习</title>
	<style type="text/css">
		h1{
     color: red}
		p{
     color: blue}
		a{
     
		  color: yellow;
		  background:black;			
			}
	</style>
</head>
<body>
	<h1>header 1</h1>
	<p>A paragraph.</p>
	<a href="https://blog.csdn.net/a392544151/article/details/120646013" target="_blank">快点开，里面有好东西！</a>
</body>
</html>

效果图:
（文字更改了颜色、有的更改了背景颜色）
在这里插入图片描述

（美化版）一只特立独行的猪🐖

<!DOCTYPE html>
<html>
<head>
    <title>一只特立独行的猪</title>
    <meta charset="utf-8">
    <

最低0.47元/天解锁文章

敲代码的小朋友

关注

2
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫