用Html 和 Css来实现一个小小案例

                 用Html 和 Css来实现一个小小案例

开发工具与关键技术：Html Css
作者：沈金凤
年级：18级（5）班
撰写日期：2019年1月17日

1.在Html 中我们会发现许多有趣的事件来，就比如在一个Html的容器中直接加两张图片设置不同的的 Css 的样式也会有不同的结果。Css的样式除了在新建的Css的文件中完成之外，还可以在Html中完成，而我今天就是在Html中完成的一些样式，在Html中写Css样式必须要写上style标签才能执行。如下图所示：
（1). 第一种样式：Html：如下图：1

Css：这里是用了内边距来形成的如下图：2

结果图：3

（2）.第二种样式：
Css ：第二个则是用外边距来形成，还有一些它们共同样式圆角部分和盒子的阴影部分如下图：4

结果图: 5

2.第一次利用弹性布局来完成一个小小的案例，虽然不是很好，但也从中获得了一些新知识。感觉挺不错的! 如下图所示:
Html 和 Css：图片：6

结果图：7

菜鸟的写作请各位大神多多指教。

用Html 和 Css来实现一个小小案例相关推荐

用CSS来做一个动画案例
今天来做这么一个案例添加一个动画实现上下渐变滚动的效果首先还是我们HTML部分,一个大盒子装着五个子元素下面别在意,之前写的时候看到有个网站有这么个注解我就复制了下来哈哈哈 <div cl ...
java cell报错_有一个小小点问题，现在我想从eclipse上读取Excel表
该楼层疑似违规已被系统折叠隐藏此楼查看此楼有一个小小点问题,现在我想从eclipse上读取Excel表,但是sheet的方法getcell报错,请问这是哪儿的错呢?谢谢源码及报错图片如下: pa ...
HTML CSS JavaScript 从一个表格到一个灰阶颜色表（目录）
HTML & CSS & JavaScript 从一个表格到一个灰阶颜色表 01 HTML & CSS & JavaScript 从一个表格到一个灰阶颜色表 02 HT ...
[html] 举例说明只用html和css如何使得一个列表编号倒序？
[html] 举例说明只用html和css如何使得一个列表编号倒序? <!DOCTYPE html> <html> <body> <style> ol{ ...
[css] 手写一个满屏品字布局的方案
[css] 手写一个满屏品字布局的方案 <!DOCTYPE html> <html><head><meta name="viewport" ...
[css] 怎样把一个div居中？怎样把一个浮动元素居中？怎样把绝对定位的div居中？
[css] 怎样把一个div居中?怎样把一个浮动元素居中?怎样把绝对定位的div居中? 主要用到:text-alin: center;margin: 0 auto;position: relative ...
[css] 用CSS画出一个任意角度的扇形，可以写多种实现的方法
[css] 用CSS画出一个任意角度的扇形,可以写多种实现的方法先画一个圆,外加两个绝对定位的半圆扇形可以通过两个半圆作为遮罩旋转来露出相应的角度实现这只能切出180°以内的扇形超过180°的 ...
[css] 如果给一个元素设置background-color,它的颜色会填充哪些区域呢？
[css] 如果给一个元素设置background-color,它的颜色会填充哪些区域呢? 个人简介我是歌谣,欢迎和大家一起交流前后端知识.放弃很容易, 但坚持一定很酷.欢迎大家一起讨论主目录与 ...
[css] 使用css画出一个五角星
[css] 使用css画出一个五角星 #star-five {margin: 50px 0;position: absolute;display: block;color: red;width: 0; ...

用Html 和 Css来实现一个小小案例

用Html 和 Css来实现一个小小案例相关推荐

最新文章

热门文章