web前端学习（十二）——初识CSS3_wed前端页面12作业-程序员宅基地

技术标签： 学习  前端  # 【HTML+CSS+JavaScript】  css3  

1.什么是CSS？

  • CSS 指层叠样式表 (Cascading Style Sheets)
  • 样式定义如何显示 HTML 元素
  • 样式通常存储在样式表中
  • 把样式添加到 HTML 4.0 中，是为了解决内容与表现分离的问题
  • 外部样式表可以极大提高工作效率
  • 外部样式表通常存储在 CSS 文件中
  • 多个样式定义可层叠为一个

2.CSS语法 

CSS 规则由两个主要的部分构成：选择器，以及一条或多条声明:

选择器通常是您需要改变样式的 HTML 元素。

每条声明由一个属性和一个值组成。

属性（property）是您希望设置的样式属性（style attribute）。每个属性有一个值。属性和值被冒号分开。

CSS声明总是以分号(;)结束，声明总以大括号({})括起来。为了让CSS可读性更强，你可以每行只描述一个属性。

注释是用来解释你的代码，并且可以随意编辑它，浏览器会忽略它。

CSS注释以 /* 开始, 以 */ 结束。（这与Java中的注释方法是类似的）

3.CSS简单的应用举例 

3.1 实例一： 

<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="utf-8">
		<title>CSS简单学习</title>
		<style>
			body
			{
				background-color: aqua;
			}
			h1
			{
				color: brown;
				text-align: center;
			}
			/*这是一行注释*/
			p
			{
				/*这是另一行注释*/
				color: deeppink;
				font-family: "楷体";
				font-size: 20px;
			}
		</style>
	</head>
	
	<body>
		<h1>CSS实例</h1>
		<p>这是一个段落。</p>
	</body>
</html>

3.2 实例二

<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="utf-8">
		<title>CSS简单学习</title>
		<style>
			body {background-color: burlywood;}
			h1 {color: chocolate;}
			hr {color: black;}
			p 
			{
				color: darkred;
				font-size: 15px; 
				text-align: left;
			}
			a:link {color: red;}
			a:visited {color: blue;}
			a:hover {color: chartreuse;}
			a:active {color: white;}
		</style>
	</head>
	
	<body>
		<h1>这是一个一级标题</h1>
		<hr/>
		<p>这个段落是被设定的CSS样式渲染的。</p>
		<p>
			<a href="https://www.baidu.com" target="_blank">这是一个链接</a>
		</p>
	</body>
</html>
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_43823808/article/details/112848446

智能推荐

友盟自动集成报错-Could not download common (com.umeng.umsdk:common:2.0.0)_could not find com.umeng.umsdk:common:2.0.2.-程序员宅基地

文章浏览阅读1.2w次。当使用自动集成（非手动集成）友盟的时候在build.gradle里面：implementation 'com.umeng.umsdk:analytics:8.0.0'implementation 'com.umeng.umsdk:common:2.0.0'但是今天一直报错Could not download common (com.umeng.umsdk:common:2.0.0)..._could not find com.umeng.umsdk:common:2.0.2.

Docker 快速上手学习入门教程_docker菜鸟教程-程序员宅基地

文章浏览阅读2.5w次，点赞6次，收藏50次。官方解释是，docker 容器是机器上的沙盒进程，它与主机上的所有其他进程隔离。所以容器只是操作系统中被隔离开来的一个进程，所谓的容器化，其实也只是对操作系统进行欺骗的一种语法糖。_docker菜鸟教程

电脑技巧：Windows系统原版纯净软件必备的两个网站_msdn我告诉你-程序员宅基地

文章浏览阅读5.7k次，点赞3次，收藏14次。该如何避免的，今天小编给大家推荐两个下载Windows系统官方软件的资源网站，可以杜绝软件捆绑等行为。该站提供了丰富的Windows官方技术资源，比较重要的有MSDN技术资源文档库、官方工具和资源、应用程序、开发人员工具（Visual Studio 、SQLServer等等）、系统镜像、设计人员工具等。总的来说，这两个都是非常优秀的Windows系统镜像资源站，提供了丰富的Windows系统镜像资源，并且保证了资源的纯净和安全性，有需要的朋友可以去了解一下。这个非常实用的资源网站的创建者是国内的一个网友。_msdn我告诉你

vue2封装对话框el-dialog组件_<el-dialog 封装成组件 vue2-程序员宅基地

文章浏览阅读1.2k次。vue2封装对话框el-dialog组件_

MFC 文本框换行_c++ mfc同一框内输入二行怎么换行-程序员宅基地

文章浏览阅读4.7k次，点赞5次，收藏6次。MFC 文本框换行 标签： it mfc 文本框1.将Multiline属性设置为True2.换行是使用"\r\n" (宽字符串为L"\r\n")3.如果需要编辑并且按Enter键换行,还要将 Want Return 设置为 True4.如果需要垂直滚动条的话将Vertical Scroll属性设置为True,需要水平滚动条的话将Horizontal Scroll属性设_c++ mfc同一框内输入二行怎么换行

redis-desktop-manager无法连接redis-server的解决方法_redis-server doesn't support auth command or ismis-程序员宅基地

文章浏览阅读832次。检查Linux是否是否开启所需端口，默认为6379，若未打开，将其开启：以root用户执行iptables -I INPUT -p tcp --dport 6379 -j ACCEPT如果还是未能解决，修改redis.conf，修改主机地址：bind 192.168.85.**；然后使用该配置文件，重新启动Redis服务./redis-server redis.conf..._redis-server doesn't support auth command or ismisconfigured. try

随便推点

Java入门基础知识点总结（详细篇）_java基础知识重点总结-程序员宅基地

文章浏览阅读2.3w次，点赞71次，收藏638次。Java入门基础知识点总结（详细篇）~~~~~目录1.1 图解1.1.1 Java基础知识点1.1.2 Java基础语法的相关内容1.2 关键字1.3 标识符1.3.1 标识符概念1.3.2 定义标识符的合法规则1.3.3 Java中的一些命名规范1.4 变量1.4.1 变量的分类1.4.2 整数类型1.4.3 浮点类型1.4.4 字符类型char1.4.5 布尔类型boolean1.5 ASci..._java基础知识重点总结

【SpringBoot】82、SpringBoot集成Quartz实现动态管理定时任务_springboot集成quratz 实现动态任务调度-程序员宅基地

文章浏览阅读3.6w次。Quartz 是一个开源的作业调度框架，它完全由 Java 写成，并设计用于 J2SE 和 J2EE 应用中。它提供了巨大的灵 活性而不牺牲简单性。你能够用它来为执行一个作业而创建简单的或复杂的调度。它有很多特征，如：数据库支持，集群，插件，EJB 作业预构 建，JavaMail 及其它，支持 cron-like 表达式等等_springboot集成quratz 实现动态任务调度

testNG常见测试方法_idea_java_testng 测试-程序员宅基地

文章浏览阅读550次。testNG忽略测试，跑测试用例时忽略暂时不执行的方法在@Test注释后添加false属性,不手动添加时默认是truepackage com.ngtest.suite;import org.testng.annotations.Test;public class ignoreTest { @Test //有test标签一定会被测试到,默认的属性是true public void ignore1(){ System.out.println("ignore1 执行._testng 测试

Debian11系统安装-程序员宅基地

文章浏览阅读4w次，点赞42次，收藏338次。Debian11系统安装1. 启动镜像启动镜像，进入安装界面，默认选择第一个图形化安装界面，回车2. 选择语言这里选择English语言，然后点击Continue3.选择所在位置4. 键盘布局默认American English,然后点击Continue5. 设置主机名默认主机名(hostname)为debian,点击Continue6. 设置域名设置域名（Domain name）为jamysong,这里大家可以根据自己的来设定7. 设置root账户密码这里我设置roo_debian11

Centos7重置root用户密码_centos7更改root密码-程序员宅基地

文章浏览阅读7.5k次，点赞5次，收藏21次。Linux操作系统重置root口令_centos7更改root密码

STM32常用协议之IIC协议详解_正点原子stm32 iic-程序员宅基地

文章浏览阅读3.7k次，点赞9次，收藏39次。提示：文章写完后，目录可以自动生成，如何生成可参考右边的帮助文档IIC协议详解前言一、IIC协议简介1.1 简介1.2 IIC物理层1.3 协议层1.3.1 IIC基本读写过程1.3.2 通信的起始和停止信号1.3.3 数据有效性1.3.4 地址及数据方向1.3.5 响应二、IIC特性2.1 软件模拟协议2.1.1 引言2.1.2 IIC初始化函数2.2 硬件协议二、使用步骤1.引入库2.读入数据总结前言STM32常用协议系列文章一、IIC协议简介1.1 简介IIC（Inter -._正点原子stm32 iic

推荐文章

热门文章

相关标签