四块五的妞 发表于 2021-1-7 16:41

今天考试HTML,那位大佬讲下下面问题

效果图先上

<!DOCTYPE html>
<html lang="en">
<head>
        <meta charset="UTF-8">
        <title>Document</title>
</head>
<body>
<form action="center">
<fieldset>
<legend>学生个人档案</legend>
        姓名:</p>
        <input type="text" name="" value="请输入学生姓名" style="width: 200px"></p>
        手机号码:</p>
        <input type="text" name="" value="请输入手机号" maxlength="11" style="width: 200px"></p>
        邮箱地址:</p>
        <input type="mail" name="" value="" style="width: 200px"></p>
        所属学院:</p>
        <input type="text" name="" value="" style="width: 200px"></p>
        入学成绩:</p>
        <input type="text" name="" value="" style="width: 200px"></p>
        基础水平:</p>
        <progress value="59" max="100"                 style="width: 200px"></progress></p>
        入学日期:</p>
        <input type="datetime-local"                style="width: 200px"></p>
        毕业时间:</p>
        <input type="month"                                style="width: 200px"></p>
        课程进度:</p>
        <progress value="59" max="100"                 style="width: 200px"></progress></p>
        <input type="submit" name="" value="确认无误后再点提交" style="width:200px">
        </fieldset>
</form>
</body>
</html>
问题:
1,这个右边边框线上面字母怎么写上?
2,这个用表单写还是用盒子写方便?

ltzxd 发表于 2021-1-7 16:45

1. 用绝对定位position

2. div更好控制

庸世俗人罢勒 发表于 2021-1-7 16:48

1.右边的字母用定位解决吧position;
2.盒子写可能可读性和兼容性高?{:1_904:}

basonwoo 发表于 2021-1-7 16:48

用div,最外层相对定位,文字绝对定位

lnshijia 发表于 2021-1-7 16:54

定位 div

辉夜年华 发表于 2021-1-7 16:57

如果不想用绝对定位,你就勇哥panel,应该也能达到相应的效果

c03xp 发表于 2021-1-7 17:01

padding-top 用负数,不知道能不能实现。span背景改为白色实现遮挡边框

小核桃爱编程 发表于 2021-1-7 17:09

c03xp 发表于 2021-1-7 17:01
padding-top 用负数,不知道能不能实现。span背景改为白色实现遮挡边框

用绝对定位,背景色为白色

xiaoyudian 发表于 2021-1-7 17:11

用position解决定位

liangqz 发表于 2021-1-7 17:15

绝对定位,调参数
页: [1] 2 3
查看完整版本: 今天考试HTML,那位大佬讲下下面问题