index.html
<!DOCTYPE html> <html lang="zh-cn"> <head> <meta charset="utf-8"> <title>CSS边框与背景[下]</title> <link rel="stylesheet" type="text/css" href="style.css"> </head> <body> <div>我是<b>HTML5</b>，我是<b>HTML5</b>，我是<b>HTML5</b>，</div> <!-- <div>我是<b>HTML5</b>，我是<b>HTML5</b>，我是<b>HTML5</b>，</div> <div>我是<b>HTML5</b>，我是<b>HTML5</b>，我是<b>HTML5</b>，</div> <div>我是<b>HTML5</b>，我是<b>HTML5</b>，我是<b>HTML5</b>，</div> --> </body> </html>
style.css
@charset "utf-8";
/*html {
height: 100%;
}*/
body {
/*background-color: silver;*/
/*background-image: url(loading.gif);*/
/*background-image: none;*/
/*background-repeat: repeat-x;*/
/*background-repeat: repeat-y;*/
/*background-repeat: repeat;*/
/*background-repeat: no-repeat;*/
/*background-position: top;*/
/*background-position: right;*/
/*background-position: left;*/
/*background-position: bottom;*/
/*background-position: center;*/
/*background-position: right top;*/
/*background-position: left bottom;*/
/*background-size: cover;*/
/*background-size: 200px 200px;*/
/*background-size: 100%;*/
/*background-attachment: scroll;*/
/*background-attachment: fixed;*/
}
div {
width: 500px;
height: 300px;
/* background-color: silver;
background-image: url(img.png);
background-repeat: no-repeat;
background-position: bottom;*/
border: 10px dashed red;
padding: 50px;
/*background-image: url(loading.gif);*/
/*background-image: url(img.png);*/
/*background-size: cover;*/
/*background-size: contain;*/
/* background-repeat: no-repeat;
background-origin: border-box*/;
/*background-origin: padding-box;*/
/*background-origin: content-box;*/
/*background-clip: border-box;*/
/*background-clip: padding-box;*/
/* background-clip: content-box;*/
background: silver url(img.png) no-repeat top left / 100% border-box content-box;
}
/*div b {
background-color: red;
}
div b:first-child {
background-color: transparent;
}*/
相关推荐
在HTML5中，CSS边框和背景是网页布局和设计中非常重要的视觉元素，它们...通过本次课程的学习，相信学习者可以更好地掌握CSS边框与背景的样式设置，并将其应用于实际的网页设计工作中，提升网页的视觉效果和用户体验。
通过巧妙地组合和利用这些CSS边框与背景的属性，设计师能够创建出丰富多彩、引人注目的网页界面。在实际应用中，还要考虑到浏览器兼容性和性能优化，确保在各种设备和环境下都能呈现出预期的效果。 在压缩包中的`...
第十七章与背景和边框相关样式 第十八章CSS 3中的变形处理 第十九章CSS 3中的动画功能 第二十章布局相关样式 第二十一章Media Queries相关样式 第二十二章CSS 3的其他重要样式和属性 第二十三章综合实例
第11章 CSS3美化背景与边框 第12章 Java Script概述 第13章 Java Script语言基础 第14章 Java Script内置对象 第15章 Java Script对象编程 第16章 Java Script操纵CSS3 第17章 HTML5、CSS3和Java Script 第18...
李刚 疯狂HTML5CSS3JavaScript讲义的源代码 第一部分 第1章 HTML 5简介 第2章 HTML 5的常用元素与属性 ... 第17章 使用Worker创建多线程 第18章 客户端通信 第四部分 第19章 HTML 5的疯狂俄罗斯方块
第11章 CSS3美化背景与边框 第12章 Java Script概述 第13章 Java Script语言基础 第14章 Java Script内置对象 第15章 Java Script对象编程 第16章 Java Script操纵CSS3 第17章 HTML5、CSS3和Java Script 第18...
第1章 （X）HTML与CSS核心基础 1.1 HTML与XHTML 1.1.1 追根溯源 1.1.2 DOCTYPE（文档类型）的含义与选择 1.1.3 XHTML与HTML的重要区别 ...第17章 从学习到创作 附录 CSS英文小字典
**第十一章：CSS布局模式** 这一章深入探讨了网格布局、Flexbox（弹性盒子）和Grid（CSS布局网格），这些都是现代网页布局的重要工具，可以创建更加灵活和响应式的页面结构。 **第十二章：实战案例分析** 通过实际...
全书pdf 210M, 共分9个分卷, 这是第8分卷 中文名: 精通CSS与HTML设计模式 英文名: Pro CSS and HTML Design Patterns ...第17章 布局 第18章 字母下沉 第19章 强调框和引用 第20章 提示框 索引...
第1章 （X）HTML与CSS核心基础 1.1 HTML与XHTML 1.1.1 追根溯源 1.1.2 ...变宽度网页布局剖析与制作 第15章 “CSS禅意花园”作品研究 第16章 综合案例研究 第17章 从学习到创作 附录 CSS英文小字典
第17章（源代码\第17章） 示例描述：本章演示文本属性用法。 垂直对齐.html 设置垂直对齐。 空格处理.html 设置空格处理。 设置水平对齐.html 设置水平对齐。 首行缩进.html 首行缩进的用法...
第17章 文件支持与二进制数据 572 17.1 HTML 5增强的文件上传域 573 17.2 ArrayBuffer与TypedArray 578 17.3 Blob类 583 17.4 本章小结 587 第18章 Web Worker多线程API 588 18.1 使用Worker创建多线程 589 ...
全书pdf 210M, 共分9个分卷, 这是第7分卷 中文名: 精通CSS与HTML设计模式 英文名: Pro CSS and HTML Design Patterns 资源格式: PDF ...第17章 布局 第18章 字母下沉 第19章 强调框和引用 第20章 提示框 索引..
全书pdf 210M, 共分9个分卷, 这是最后一个分卷, 第9分卷 中文名: 精通CSS与HTML设计模式 英文名: Pro CSS and HTML Design Patterns ...第17章 布局 第18章 字母下沉 第19章 强调框和引用 第20章 提示框 索引..
全书pdf 210M, 共分9个分卷, 这是第3分卷 中文名: 精通CSS与HTML设计模式 英文名: Pro CSS and HTML Design Patterns 资源格式: PDF ...第17章 布局 第18章 字母下沉 第19章 强调框和引用 第20章 提示框 索引
全书pdf 210M, 共分9个分卷, 这是第4分卷 中文名: 精通CSS与HTML设计模式 英文名: Pro CSS and HTML Design Patterns ...第17章 布局 第18章 字母下沉 第19章 强调框和引用 第20章 提示框 索引....