css学习4(背景)

1、CSS中,颜色值通常以以下方式定义:

  • 十六进制 - 如:"#ff0000"
  • RGB - 如:"rgb(255,0,0)"
  • 颜色名称 - 如:"red"

2、background-image 属性描述了元素的背景图像.

默认情况下,背景图像进行平铺重复显示,以覆盖整个元素实体.

3、为了简化这些属性的代码,我们可以将这些属性合并在同一个属性中.

4、当使用简写属性时,属性值的顺序为::

  • background-color
  • background-image
  • background-repeat
  • background-attachment
  • background-position

5、文本的属性主要有文本的颜色、文本的对齐方式。

6、 text-decoration属性主要是用来删除链接的下划线。

7、CSS字体属性定义字体,加粗,大小,文字样式。

8、font-family 属性应该设置几个字体名称作为一种"后备"机制,如果浏览器不支持第一种字体,他将尝试下一种字体。

9、为了避免Internet Explorer 中无法调整文本的问题,许多开发者使用 em 单位代替像素。

em的尺寸单位由W3C建议。1em和当前字体大小相等。在浏览器中默认的文字大小是16px。

8、在所有浏览器的解决方案中,设置 <body>元素的默认字体大小的是百分比。

<!DOCTYPE html>
<html><head><meta charset="utf-8"><title>背景相关</title><style>body{/*background-image:url('A.jpg');background-repeat: no-repeat;background-position: right top;*/background:red url('A.jpg') no-repeat right top;background-attachment: fixed;font-size: 100%;}p{background-color: red;color: yellow;}h1{color: rgb(0, 255, 0);text-align: center;}p.date{text-align: right;}p.main{text-align: justify; font-family: "幼圆";font-style: italic;font-size: 1em;}a {text-decoration: none;}p.capitalize{text-transform: capitalize;text-indent:100px;}</style></head><body><h1>CSS学习</h1><p>PHP是世界上最好的编程语言</p><h1>CSS text-align 实例</h1><p class="date">2015年3月14日</p><p class="main">“当我年轻的时候,我梦想改变这个世界;当我成熟以后,我发现我不能够改变这个世界,我将目光缩短了些,决定只改变我的国家;当我进入暮年以后,我发现我不能够改变我们的国家,我的最后愿望仅仅是改变一下我的家庭,但是,这也不可能。当我现在躺在床上,行将就木时,我突然意识到:如果一开始我仅仅去改变我自己,然后,我可能改变我的家庭;在家人的帮助和鼓励下,我可能为国家做一些事情;然后,谁知道呢?我甚至可能改变这个世界。”</p><p>链接到:<a href="https://www.baidu.com/">谷歌</a></p><p class="capitalize">phP是世界上最好的编程语言</p></body>
</html>

运行结果:

 

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/46781.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

2023 - java - 强制类型转换和装箱

强制类型转换和装箱&#xff1a; 在 Java 中&#xff0c;(Integer) 和(int) 是两个不同的类型转换操作符&#xff0c;它们的效果是不一样的。 int a (Integer) t.getContent(); 这条语句使用了装箱&#xff08;Boxing&#xff09;操作&#xff0c;将一个整数对象&#xff08;…

视频上传,限制时长,获取视频时长

使用element的upload上传文件时&#xff0c;除了类型和大小&#xff0c;需求需要限制只能长传18秒内的视频&#xff0c;这里通过upload的before-upload&#xff0c;以及创建一个音频元素对象拿到durtaion时长属性来实现。 getVideoTime(file) {return new Promise(async (resol…

JVM的元空间了解吗?

笔者近期在面试的时候被问到了这个问题&#xff0c;元空间也是Java8当时的一大重大革新&#xff0c;之前暑期实习求职的时候有专门看过&#xff0c;但是近期秋招的时候JVM相关的内容确实有点生疏了&#xff0c;故在此进行回顾。 结构 首先&#xff0c;我们应了解JVM的堆结构&a…

Dockerfile制作Web应用系统nginx镜像

目录 1.所需实现的具体内容 2.编写Dockerfile Dockerfile文件内容&#xff1a; 默认网页内容&#xff1a; 3.构建镜像 4.现在我们运行一个容器&#xff0c;查看我们的网页是否可访问 5.现在再将我们的镜像打包并上传到镜像仓库 1.所需实现的具体内容 基于centos基础镜像…

sql in mac学习记录

鉴于有一段时间没有访问mysql了&#xff0c;最近打算在mac 系统上下载mysql 练习一下sql的使用&#xff0c;于是 First, the mysql download https://dev.mysql.com/downloads/mysql/ Second, Mysql install steps Install the software by normally install one software …

opencv常用API记录(C++版)

文章目录 1. cv::Mat(cv::Rect) 是什么含义2. cv::Mat初始化 cv::Mat(1, 32, CV_32F,XXX)什么意思3. 如何使用opencv的多线程接口来跑多张图的resize 1. cv::Mat(cv::Rect) 是什么含义 cv::Mat(cv::Rect) 是一种使用矩形区域来构造新的 cv::Mat 对象的方式&#xff0c;其中 cv…

刷算法常见注意点

num 正无穷&#xff1a;Infinity 金额格式化&#xff1a;利用字符串提供的toLocaleString()方法处理。有时候不生效&#xff0c;比如app 数字容错&#xff1a;if(!Number.isFinite(num)){ //不是数字} js数组 头部添加unshift 、尾部增加push、首部删除shift、尾部删除pop…

时序预测 | MATLAB实现ELM极限学习机时间序列预测(多指标、相关图)

时序预测 | MATLAB实现ELM极限学习机时间序列预测(多指标、相关图) 目录 时序预测 | MATLAB实现ELM极限学习机时间序列预测(多指标、相关图)效果一览基本介绍程序设计学习总结参考资料效果一览 基本介绍 时序预测 | MATLAB实现ELM极

最大子数组和

给你一个整数数组 nums &#xff0c;请你找出一个具有最大和的连续子数组&#xff08;子数组最少包含一个元素&#xff09;&#xff0c;返回其最大和。 子数组是数组中的一个连续部分。 示例 1&#xff1a; 输入&#xff1a;nums [-2,1,-3,4,-1,2,1,-5,4] 输出&#xff1a;6 解…

前端-初始化Vue3+TypeScript

如果使用如下命令初始化项目&#xff0c;项目很干净&#xff0c;很适合了解项目的各个结构。 npm init vitelatest如果使用如下命令初始化项目&#xff0c;是可以选择你需要的组件 npm init vuelatest

vue根据template结构自动生成css/scss/less样式嵌套

vscode搜索安装插件&#xff1a;AutoScssStruct4Vue

十、接口(3)

本章概要 接口适配接口字段 初始化接口中的字段 接口嵌套接口和工厂方法模式 接口适配 接口最吸引人的原因之一是相同的接口可以有多个实现。在简单情况下体现在一个方法接受接口作为参数&#xff0c;该接口的实现和传递对象则取决于方法的使用者。 因此&#xff0c;接口的…

Linux 系统的如何优化(面试题)

Linux 系统的如何优化&#xff08;面试题&#xff09; (1) 禁用不需要的服务 ntsysv 命令最为方便&#xff0c;执行后&#xff0c;把不需要的勾选去掉就行 &#xff08;2&#xff09;避免直接使用root用户&#xff0c;普遍用户通过sudo授权操作 &#xff08;3&#xff09;通过…

wustojc日期格式变化

#include <stdio.h> int main() {char a[10];for(int i0;i<10;i){//用一个耍聪明的方法&#xff0c;全部用数组存储&#xff1b;面向结果编程a[0]getchar();}printf("%c%c%c%c%c%c%c%c%c%c",a[6],a[7],a[8],a[9],a[2],a[0],a[1],a[5],a[3],a[4]);return 0;}…

数据结构:栈和队列

文章目录 一、栈1.栈的概念及结构1.栈的概念及结构2.栈的实现 2.栈的顺序表实现1.栈的结构体和实现的功能函数2.栈的初始化&#xff0c;入栈和出栈操作3.栈的其他操作 3.栈的链表实现1.栈的结构体和实现的功能函数2.栈功能函数的实现 二、队列1.队列的概念及结构1.队列的概念及…

【使用教程】在Ubuntu下运行CANopen通信PMM伺服电机使用教程(NimServoSDK_V2.0.0)

本教程将指导您在Ubuntu操作系统下使用NimServoSDK_V2.0.0来运行CANopen通信的PMM系列一体化伺服电机。我们将介绍必要的步骤和命令&#xff0c;以确保您能够成功地配置和控制PMM系列一体化伺服电机。 NimServoSDK_V2.0.0是一款用于PMM一体化伺服电机的软件开发工具包。它提供了…

每日一学——交换机

交换机是一种网络设备&#xff0c;用于连接多台计算机和其他网络设备&#xff0c;以实现数据的交换和传输。它通过将数据包在不同端口之间转发&#xff0c;将数据从一个设备发送到目标设备。交换机可以提供高速、可靠和安全的局域网连接。 交换机的工作原理是根据目标MAC地址来…

Harmony OS教程学习笔记

基础知识 1.如何修改程序启动的第一个页面&#xff1f; 不想使用创建的默认的页面&#xff0c;这时需要修改启动页面&#xff0c;修改的地方在EntryAbility文件中的onWindowStageCreate方法中。 onWindowStageCreate(windowStage: window.WindowStage) {// Main window is cr…

【爬虫】Urllib让我们的 python 假装是浏览器

在 Python 这个内置的 Urllib 库中&#xff0c;有这么 4 个模块&#xff1a; request&#xff0c;request模块是我们用的比较多的&#xff0c;就是用它来发起请求&#xff0c;所以我们重点说说这个模块。error&#xff0c;error模块呢&#xff0c;就是当我们在使用 request 模…

Golang Gorm 更新字段 save update updates

更新和删除操作的前提条件都是要在找到数据的情况下&#xff0c;先要查询到数据才可以做操作。 更新的前提的先查询到记录&#xff0c;Save保存所有字段&#xff0c;用于单个记录的全字段更新它会保控所有字段&#xff0c;即使零值也会保存。 在更新和删除之前&#xff0c;要利…