好多人觉得html表格很难
其实从难度上来看
和论坛里这种表格没什么区别
如果想做出论坛里这种效果的话
当然如果想做更炫一点
代码量就会多
但我做的很多表格
代码可能不到50行
就可以做出很棒的效果
今天主要讲一下html代码可以做到哪些独特的效果
1. 背景图
这个算是最基础的了
也是最简单的一个
只要用的好
就可以做出非常漂亮的表格
例子就不举了
论坛里还是蛮多的
2. 字体特效(并不是图,而是可以复制的文字)
下面是我截的图,想看原帖的说下,我可以贴下原帖地址~~
这是我学会的第一个比较炫的效果
字体效果基本都是靠字体阴影来实现的
前两个是没有加入模糊的阴影
可以清晰看到阴影和字本身是一样的
第三个给字体加了八个阴影
这个可以做出一个白边的效果
第四个字体颜色为白色
加入了绿色的带模糊的阴影
可以看到字体很清透
3. 表格特效
这个就比较多了,我用的多的基本就是阴影,圆角,和旋转
关于阴影,和字体阴影是一样用的
第一个字体外面的那个框框,背景色为透明色,阴影是绿色加模糊,再加向内(阴影是在格子里面的)
第二个表格背景色白色,阴影蓝色加模糊,阴影在格子外面
关于圆角,
我一般是用来做水印用的,给字外面加一个圆的框框。
这个其实是一个边框,但边框只有左右,上下没有边框,再加上圆角就可以做到这个的效果
关于旋转
html的格子都是正着的
这个框框其实是旋转了45度后的框框
里面的文字旋转了-45度,所以看起来就像只旋转了框框一样
4. 关于动画
这部分是比较难做的
不过做习惯了还是挺好玩儿的
给个链接:
https://www.paipai.fm/r7520376右上角有四个字,“派派之声”
把鼠标放上去就可以看到,这些字是会动的~~~
这是我今天才做的
非常想炫耀一下
然后……发现小鱼缸有内容了
5. 关于定位
一般做表格,你所写的字都会在某些格子里
但有了绝对定位
就可以想把字写在哪里写在哪里
比方说:
“周年纪”这三个字其实是做为背景的
位置是左下角
而我们的正文写的时候
完全可以写在这三个字上面
只要调整下颜色
并不会影响阅读
所以我一般用这种方法来做水印~~~
以上基本是上最简单的html效果了
只要你想
html可以做出任何你想要的效果
有没有心动
想学的就行动吧~~~