打卡——html3

昨天本来要学的不止那么一点的,但是我突然看见了一条能够提升自己的消息,就去查了一下,发现了一个机会。以后每天有可能会进行较长时间的计算机教材的学习,html的进度会稍微慢一点,但是打卡的内容会少一点,因为教材上已经有的就不再重复了。

昨天是给网址增加成品CSS样式

backgroud-color:#颜色的十六进制码;   设置背景颜色

margin-left:20%;     设置页面左边外边距占页面的百分之二十

border:2px dotted black;      页面主体边框是一像素宽的黑色虚线

padding:10px 10px 10px 10px;          在页面主体周围创建一些内边距,十像素宽

font-family:sans-serif;           定义文本使用宋体

根据教材自己创建了一个不一样的网页进行练习,与下面的练习一同,截图放在章尾处

今天学习到的另外一个内容是在html文件中创建链接:

<a href="一点点推荐饮品.html"> 单击文字</a>

经过测试,大概知道为什么书中要强调是成品CSS了,没有成品无法调用格式显示页面,带着疑问继续往下学吧。

在去除CSS样式后页面能够正常显示,链接可以跳转。

今天就到这里啦,接下来的学习是关于链接如何实现跳转的理论知识,我直接在书上进行笔记了。

 

以下是一个简单的打卡考勤系统的 HTML 页面示例: ```html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>打卡考勤系统</title> <style> body { font-family: Arial, sans-serif; margin: 0; padding: 0; } h1 { text-align: center; margin-top: 50px; } form { display: flex; flex-direction: column; align-items: center; margin-top: 50px; } label { margin-bottom: 10px; font-size: 18px; font-weight: bold; } input[type="text"], input[type="password"] { padding: 10px; font-size: 16px; border-radius: 5px; border: 1px solid #ccc; width: 300px; margin-bottom: 20px; } input[type="submit"] { padding: 10px 20px; font-size: 18px; background-color: #007bff; color: #fff; border: none; border-radius: 5px; cursor: pointer; transition: background-color 0.3s ease-in-out; } input[type="submit"]:hover { background-color: #0062cc; } </style> </head> <body> <h1>打卡考勤系统</h1> <form action="#" method="post"> <label for="username">用户名:</label> <input type="text" id="username" name="username" required> <label for="password">密码:</label> <input type="password" id="password" name="password" required> <input type="submit" value="登录"> </form> </body> </html> ``` 这个 HTML 页面包含一个表单,用户需要输入用户名和密码来登录打卡考勤系统。当用户点击“登录”按钮时,表单将被提交到服务器进行验证。在实际的系统中,需要使用 JavaScript 和服务器端代码来处理表单数据并进行身份验证。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值