三、CSS样式——背景
CSS背景
概念:CSS允许应用纯色作为背景,也允许使用背景图像创建相当复杂的效果。
| 属性 | 描述 |
| background-attachment | 背景图像是否固定或者随着页面的其余部分滚动 |
| background-color | 设置元素的背景颜色 |
| background-image | 把图片设置为背景 |
| background-position | 设置图片的起始位置 |
| background-repeat |
设置背景图片是否及如何重复 |
| background-size | 规定背景图片的尺寸 |
| background-origin | 规定背景图片的定位区域 |
| background-clip | 规定背景的绘制区域 |
<!--background.html-->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<link href="style.css" type="text/css" rel="stylesheet">
</head>
<body>
<p>test the background-color</p>
<p>test the background-color</p>
<p>test the background-color</p>
<p>test the background-color</p>
<p>test the background-color</p>
<p>test the background-color</p>
<p>test the background-color</p>
<p>test the background-color</p>
<p>test the background-color</p>
<p>test the background-color</p>
<p>test the background-color</p>
</body>
</html>
/*style.css*/
body{
/*background-color: khaki;*/
background-image: url("1.jpg");
background-repeat: no-repeat; /*图片不允许重复*/
/*background-position: right top;*/
/*background-position: 100px 100px;*/
/*background-attachment: fixed;*/
background-size: 100px 100px;
/*right和center*/
} p{
width: 150px;
padding: 10px;
background-color: blueviolet;
}
三、CSS样式——背景的更多相关文章
- 3月22日 html(三)css样式表
CSS(Cascading Style Sheet,叠层样式表),作用是美化HTML网页. 一.样式表 (一)样式表的分类 1.内联样式表 和HTML联合显示,控制精确,但是可重用性差,冗余较多. 例 ...
- WEB入门三 CSS样式表基础
学习内容 Ø CSS的基本语法 Ø CSS选择器 Ø 常见的CSS样式 Ø 网页中3种使用CSS的方式 能力目标 Ø 理解CSS的 ...
- 第六篇 CSS样式 背景、背景图、文本、链接
元素背景.文本(字体)样式.链接 这里我们只学习常用的一些,更多的扩展就要同学们自己去了解,或者下方评论. 这里我们为了简便,用的是CSS的内嵌形式. 元素背景: 我们写模块的时候,有的时候为了区 ...
- css样式背景图片设置缩放
一.背景颜色图片平铺 background-color 背景颜色 background-image 背景图片地址 background-repeat 是否平铺 默认是平铺 background-pos ...
- 前端学习笔记--CSS样式--背景和超链接
1.背景 2.超链接: 举例:
- css样式之背景图片
1.css样式背景之使用图片来做为背景 example: <!DOCTYPE html> <html> <head> <meta http-equiv=&qu ...
- HTML基础(三)——css样式表
CSS(Cascading Style Sheet,叠层样式表),作用是美化HTML网页. /*注释区域*/此为注释语法 一.样式表 (一)样式表的分类 1.内联样式表 和HTML联合显示,控制精确, ...
- PHP.9-HTML+CSS(三)-CSS样式
CSS样式 CSS是Cascading Style Sheets的简写,它除了可以轻松设置网页元素的显示位置和格式处,甚至还能产生滤镜,图像淡化,网页淡入淡出的渐变效果.CSS就是要对网页的显示效果实 ...
- Bootstrap入门(三)<p>标签的css样式
Bootstrap入门(三)<p>标签的css样式 前提:引入css文件,内容放在一个class为container的div中 <p>标签属性 1.“ text-left ...
随机推荐
- vue插件
Vue.js提供了插件机制,可以在全局添加一些功能.它们可以简单到几个方法.属性,也可以很复杂,比如一整套组件库. 注册插件需要一个公开的方法install,它的第一个参数是Vue构造器,第二个参数是 ...
- python学习2---交换两个元素
1.交换两个元素 当然也可以定义一个交换函数:
- contos7搭建syslog服务端与客户端
搭建中心服务端1,编辑文件/etc/rsyslog.conf,找到以下内容,将前面的#注释符合去除#$ModLoad imtcp#$InputTCPServerRun 514 2,在/etc/rsys ...
- 利用Python中的for循环和while循环,打印各种方向的九九乘法表。
哈喽大家好,今天,可乐来给大家分享一下Python中用for循环和while循环打印九九乘法表的操作.由于本人也是刚刚接触Python不长时间,代码也是自己编写的,所以有什么不足之处还请大家多多指教. ...
- [硬件]_ELVE_STLINK下载出现nternal command error问题
我之前也出现过这个这个,然后折腾一晚上,升级什么都都不好使 最后我换了一根短的线,回归正常!!!
- C# 程序修改config文件后,不重启程序刷新配置ConfigurationManager
基本共识: ConfigurationManager 自带缓存,且不支持 写入. 如果 通过 文本写入方式 修改 配置文件,程序 无法刷新加载 最新配置. PS. Web.config 除外:Web. ...
- java8_api_xml
xml处理-1 解析xml的两种方式 DOM主要接口介绍 使用DOM解析XML 解析(parse)是指读入一个文件,确认其有正确的格式,然后将其分解成各种元素,使开发者 ...
- 20175202 《Java程序设计》迭代和JDB
一.任务详情 二.设计过程的问题及解决 1.程序编译时一直提示编译出现错误. 原因及解决:本以为声明对象和创建对象一起进行时,可以直接采用如zhubajie = new Xiyoujirenwu(); ...
- Django学习笔记之数据库-模型的操作
模型的操作 在ORM框架中,所有模型相关的操作,比如添加/删除等.其实都是映射到数据库中一条数据的操作.因此模型操作也就是数据库表中数据的操作. 添加模型 添加模型到数据库中.首先需要创建一个模型.创 ...
- Docker系列(二)镜像下载、操作容器、镜像导入导出等操作
一.镜像操作 列出镜像 $sudo docker images 从dockerhub检索image $docker search image_name 下载image $docker pull ima ...