如何制作个人简历?
说到简历,大家应该第一个想到的是ps,或者使用word表格来制作打印
可是很多时候带着的时候并不方便,所以今天我们教大家用html的table标签来制作个人简历
需要的时候无论哪个手机都可以查看自己的简历!
是不是很方便呢?
----------------------------------------------------------------
ok!废话不多说,直接上教程:
table是html中的一个表格标签
这个标签实用性很高,但出场率并不高
他可以用来做网页布局,亦可以拿来做表格
通俗一点说table就是一个盒子
他是这样的
----------------------------------------------------------------
它下面你可以给他横排和纵排
分别是tr和td
看上去就是一个表格啦
(tr表示横排td表示竖排,所以td装在tr内)
他是这样的
----------------------------------------------------------------
当然,这时候table是没有边框的
我们再给它加上边框一个基本的个人简历就制作完成了
好的
下面开始我们的代码教程
----------------------------------------------------------------
首先
我们放上一张图片img
并且给他设置我想要的宽高,这里用的是300像素
----------------------------------------------------------------
接下来添加table表格
先来一个tr,六个td
分别写上姓名 民族 联系号码
顺便用div分别装上img和table
设置div宽为100%;高就自适应
这样的目的是分开图片和表单并居中
----------------------------------------------------------------
接下来给table边框写上去
还有宽高
----------------------------------------------------------------
下面的内容自己添加
可点击使用的是a标签
将a标签嵌套在td内即可
我们来讲讲精华部分
如果是空白部分想要占几行怎么办?
给他添加colspan属性即可
值为几便是几行
这里我们使用的是5行
添加上即可
----------------------------------------------------------------
那同时占两列呢?
很简单,用rowspan属性即可
同理值为几跨几列
不过值得注意的是
第一个tr内的td设置了以后它占两列,但是下面的tr首个成为了第二个,因为第一个的位置被上一个tr内的td占了
最后最后
td内的居中用td属性的align,值为center,也就是居中的意思
----------------------------------------------------------------
新手领地
html为结构
css为样式
javascript是行为,简称js
html内的标签自带属性用等号(=)
如:<td rowspan="2" align="center">1</td>
这里的rowspan align都是属性,2和center是值
css中的叫样式
一般用类名(class=“”)取名使用或id命名
css都是用的“:”而不是“=”
如:
width: 100%;
display: flex;
justify-content: center;
align-items: center;
(以上内容均为自创,转载注明出处,否则必将追究其责任)
转自:公众号 双鱼站
作者:小鱼儿