html5-表单_自定义字体

html5-表单_自定义字体_02

例子：

text,number,email 的输入框


<!-- required：必填项 -->
            <!-- autofocus：获得焦点 -->
            <!-- placeholder="请输入姓名" -->

            <label for="name">
                姓名：<input type="text" name="" id="name" required autofocus placeholder="请输入姓名">
            </label>
            <label class="lab">
                手机号：<input type="tel" name="" pattern="1\d{10}" required placeholder="请输入手机号">
            </label>
            <label>
                email:<input type="email" name="" placeholder="请输入email">
            </label>


 

下拉框自动填充：、


　　　　　　<label>
　　　　　　　　所属学院：<input type="text" name="" list="cla" placeholder="软件测试1503班"> <datalist id="cla"> <option value="软件测试1501班"></option> <option value="软件测试1501班"></option> <option value="软件测试1501班"></option> <option value="软件测试1504班"></option> </datalist> </label>


其他：


<label>
                入学成绩：<input type="number" max="100" step="10" value="80" name="" id="score">
            </label>
            <label>
                基础水平：<meter min="0" max="100" low="60" high="80" id="level" value="80"></meter>
            </label>
            <label>
                入学时间：<input type="date" value="2016-09-01">
            </label>
            <label>
                毕业时间：<input type="date" value="2017-09-01">
            </label>
            <label>
                课程进度：<progress value="30" max="100" min="0"></picture>
            </label>
            <input type="submit" name="" value="提交" id="but">


 html自定义字体：


body{
            font-family: 'myface', serif;
            font-size: 24px;
        }
        @font-face {
           font-family: 'myface';
           src: url('./LANENAR_-webfont.ttf'); 
        }


标题：


<form action="">
        <fieldset>
            <legend>学生档案</legend>
            
        </fieldset>
    </form>