摘要:
CSS3中,可以给文字添加阴影,也可以给盒子添加阴影,从而达到更好的视觉效果 文字添加阴影用text-shadow属性,默认none。 texe-shadow 语法: h-shadow:阴影的水平位置 v-shadow:阴影的垂直位置 blur:阴影的模糊程度 color:阴影的颜色 HTML: C 阅读全文
摘要:
利用animation的动画过渡效果制作一个图片旋转的动画。 随便取了一个图片素材 HTML代码: CSS代码: 动画效果: 阅读全文
摘要:
使用弹性盒子可以更方便的对页面内容进行布局 flex-direction指定了子元素在父元素盒子中的排列方式 1.flex-direction:row flex默认排列方式,从左到右排列,左对齐 2.flex-direction:row-reverse 与row反向,从右向左排列,右对齐,第一个在最 阅读全文
摘要:
常用的transform功能: 1.translate 位移 实现位移: 2.rotate 旋转 3.scale 缩放 4.skew 扭曲 阅读全文
摘要:
盒子模型在网页的布局中非常重要,基本上每个HTML都会用。 盒子模型用来封装HTML的内容,包括外边距(Margin),边框(Border),内边距(Padding),内容(Content)。 图形说明: Margin:外边距是块元素之间的间距 Border:边框就是块元素本身 Padding:设置 阅读全文
摘要:
关于给HTML页面内容添加样式的几个方法: 下面拿一个div为例: 简单设定宽度高度,设置字体颜色,背景颜色,居中,之间用分号隔开。 1.直接在div标签加style样式: 2.样式放在<head></head>标签里: 3.用CSS添加样式: HTML: CSS样式: 上面三种方法,都给div添加 阅读全文
摘要:
合理的页面布局,是所有HTML页面的一个基础。 1.可以利用表格,构建页面的布局,在进行内容的填充。 2.使用div,配合float或者flex对页面进行布局。 早期的方法,就是利用table表格来进行页面的布局。 一个简单的table布局: 显示效果: 用div布局: 把float换成flex同样 阅读全文
摘要:
HTML中的列表: 有序列表 -- ol 无序列表 -- ul 定义列表 -- dl 有序列表、无序列表都是通过<li>标签来定义列表的项,定义列表则不同,用<dt>来定义列表的项目<dd>来定义项目的描述。 有序列表 示例: 显示效果: 有序列表默认的是阿拉伯数字排序,还可以更改列表样式,把前面的 阅读全文