下载本文档
版权说明:本文档由用户提供并上传,收益归属内容提供方,若内容存在侵权,请进行举报或认领
文档简介
1、html5如何制作一份邀请函目的:制作这个简易的邀请函,只是为了让新手入门web开发。在制作页面之前,我们先来看看囫囵邀请函的整风光貌。一、首先编写html代码解释: :这形如一个对文档的声明。 标签:代表了对html的开头,代表着html的结束。 标签:它包含了对html5页面各种属性,配置信息的描述。因此在某种程度上可以视为一张身份证。 标签:用法标签的charset来加以设置,将其字符编码指定为utf-8;utf-8这是一种通用编码形式,又被称为万国码。 标签:即页面的标题,显示在扫瞄器器的菜单栏上。 标签:包含了全部要展现给扫瞄者的内容信息。 标签:这是一个频繁的块级元素,相当于一个容
2、器,它常常用来div css布局。在这里我们用他来调节页面的位置。 标签:这是一个标题,他有1——6六个级别。 标签:这表示一个段落。 标签:这是一个链接。 二、页面的美化:css1、给页面添加背景:我们在给网页添加背景的时候,我们选取的背景可能像素比较大,不适应我们的扫瞄器窗口;所以我们给body的background属性在横向和纵向两个方向上居中(center),因为扫瞄器默认是没有赋予body高度属性的,所以要给body和body的父级(html)设置height:100%属性。在body设置属性background-size:cover;实现背景
3、自适应弥漫全屏。2、为网页添加字体的样式font-family:属性可以转变字体。color:可以转变字体的色彩,因为css具有继承机制,所以后续的元素都有这一属性。3、调节邀请函内容区域位置。首先,我们用法margin: 0;padding: 0;这是一个很频繁的作法,能够清晰扫瞄器对页面元素预设的一些默认边距值,使得css自主控制越发精确。这里我们用法id挑选器( id名),我们设置其宽度100%;利用text-ailgn:center,让其文本水平居中。那么如何实现竖直剧中呢? 这里就用到了定位:我们要控制container的top属性,这要建立在肯定定位的前提下,而要使得contain
4、er肯定定位,就要使他的父级(body)设置为相对 定位。 之后我们利用属性,让top距顶50%。现在还没有结束,我们可以利用html5的transform属性,设置translatey(-50%);即向上移动其高度的一半。这样囫囵container将会显示在页面的正中心。4、为其内容标签设置一些文字字体与字号。解释:font-size :设置字体的大小。text-transform:uppercase :是文本都转化为大写字母。margin-bottom:20px :这里牵扯到盒模型,其意思是下边框有20px的宽度。5、制作邀请函按钮。border:为其设置边框,该属性的三个参数分离代表了边框宽1px,实线,色彩。border-radius: 为其边框设置了3px的圆角。padding:上下内边距为10px;左右内边距为100px。text-decoration:none : 这样可以去掉链接的下划线。整体css文件:三、为页面创建交互首先我们为链接添加id为button。利用docume
温馨提示
- 1. 本站所有资源如无特殊说明,都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
- 2. 本站的文档不包含任何第三方提供的附件图纸等,如果需要附件,请联系上传者。文件的所有权益归上传用户所有。
- 3. 本站RAR压缩包中若带图纸,网页内容里面会有图纸预览,若没有图纸预览就没有图纸。
- 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
- 5. 人人文库网仅提供信息存储空间,仅对用户上传内容的表现方式做保护处理,对用户上传分享的文档内容本身不做任何修改或编辑,并不能对任何下载内容负责。
- 6. 下载文件中如有侵权或不适当内容,请与我们联系,我们立即纠正。
- 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。
最新文档
- 2026年安徽矿业职业技术学院高职单招笔试化学历年参考题库含答案解析
- 2026年安徽新闻出版职业技术学院高职单招笔试英语历年参考题库含答案解析
- 2026年大学试题(管理类)-HSSE管理历年参考题库含答案解析
- 2026年大学试题(法学)-农村常见法律纠纷与危机处理历年参考题库含答案解析
- 2026年宁夏理工学院高职单招笔试综合素质历年参考题库含答案解析
- 2026年大学试题(林学)-盆景学历年参考题库含答案解析
- 2026年大学试题(教育学)-科研方法与论文写作历年参考题库含答案解析
- 2026年大学试题(教育学)-学前儿童数学教育幼儿数学教育历年参考题库含答案解析
- 2026年天津交通职业学院高职单招笔试职业技能测验历年参考题库含答案解析
- 2026年大兴安岭职业学院高职单招笔试物理历年参考题库含答案解析
- 县市直单位财务培训课件
- 2025至2030全球及中国军用飞机加油车行业发展趋势分析与未来投资战略咨询研究报告
- 2025年养老金融服务财务风险防控可行性研究报告
- 碳一化工培训课件
- 航天十院考试试题及答案
- 2025年高中英语教师课程标准考试测试卷及答案(共三套)
- 种猪引种隔离管理制度
- 农民培训教师管理制度
- 高内涵细胞分析系统应用
- 供电营销安全课件
- 人教版四年级上册数学《速度、时间和路程》获奖说课稿
评论
0/150
提交评论