对HTML和css的学习理解,学习html和css

初次使用博客——记录初学html和css

前言:本人初学html和css,如有错误还望海涵

正文:首先说html和css,html是用于编辑网站页面的文本格式本身也可以对自身元素进行排版和设置格式,而css则是对html进行更好的格式排版和编辑。

因为hmtl和css创作的页面只是静态页面,与用户互动并不完善,就需要jsp和js后期处理页面后台的数据。本章就先不说jsp和js了,说说怎么样布置一个简单的页面。如下:

首先新建一个文件夹code,里面再创2个文件夹css和img,文件夹css是用于储css文件,img则是存储要用到的图片。如下图

6c1555302777729326ca3efa0910d9ec.png

然后就是在code文件夹下创建html文件,如下图

6c1555302777729326ca3efa0910d9ec.png

本人这里就写个简单的登入页面代码

如下代码:

登入界面

//导入css样式布局

//用于导入背景,下面是一些登入需要用到元素

注册

后在img文件夹下放图片,记住名字后,去css文件夹下个css文件

代码如下:

@charset "utf-8";

#backgroundjpg{

width: 100%;

min-width: 1263px;

height: 900px;

background: url(../img/timg.jpg) no-repeat center; //导入图片

position: relative; //相对距离和后面的绝对距离匹配

}

#backgroundjpg .center1{

width: 260px;

height: 100px;

background-color: #000;

position: absolute;

top: 40%;

left: 50%;

margin: -50px 0 0 -150px;

opacity: 0.6; //透明度

}

#backgroundjpg .table{

width: 300px;

height: 100px;

background-color: #eee;

position: absolute;

top: 40%;

left: 50%;

margin: -80px 0 0 -170px;

font-size: 20px;

}

#backgroundjpg .table .text{

font-size: 30px;

}

最后就可以去最后的结果图了

6c1555302777729326ca3efa0910d9ec.png

感谢阅读本章!本人是初学者,可能不够做得精细还有一些代码是参考大佬做的,如有错误还望见谅。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值