html、css、js分工，内核，html头，html表单

2023年2月15日 129次阅读 来源: 李钢铁

html:内容
css:款式
js：交互

内核

浏览器控制台输入navigator.userAgent,回车显现出内核”Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/67.0.3396.99 Safari/537.36″
1.webkit(Safari、chrome浏览器内核)
2.Trident(IE浏览器内核)
3.Gecko（FireFox浏览器内核）
4.blink(Google之前受Apple限定，本身新出的内核）
4.Presto(Opera浏览器内核，后又站队到Google)

html头

1.html头<!DOCTYPE html>示意文档范例是html,不加这句话在IE6下会有兼容性问题。
2.<meta charset=”utf-8″>meta示意源，charset示意字符集，不设置utf-8默许是GB2312简体中文,在mac体系中不辨认，翻开是乱码。
<meta name=”viewport” content=”width=device-width, initial-scale=1″>viewport示意可视窗口，content=”width=device-width”示意可视窗口宽度即是装备宽度。initial-scale=1示意初始缩放是一倍。user-scalable=no示意不允许用户用手缩放。
<meta name=”keywords” content=”小米手机、三星手机”>这些设置我们看不见，是给搜索引擎看的，一些爬虫依据keywords、content查找。
<meta name=”description” content=”1234567890balabala”>这是引见，也有助于搜索引擎优化。这些都是给浏览器看的。

body

<img>标签 alt示意没有图片是显现的替代笔墨，title示意鼠标在图片上是给出的提醒信息。

<table border="1" cellspacing="0">
    <tr>
        <td>11</td>
        <td colspan="2">22</td>
    </tr>
    <tr>
        <td rowspan="2">44</td>
        <td>55</td>
        <td>66</td>
    </tr>
    <tr>
        <td>88</td>
        <td>99<td>
    </tr>
</table>

表单

<form action="">
    <label for="username">用户名</label>
    <input type="text" id="username">
    <label for="pwd"></label>暗码:</label>
    <input type="password" id="pwd">
</form>
加上<label>标签，for和id的值一样，会将用户名与输入框变成一个团体，点击用户名，输入框就能够聚焦。

性别：
<input type="radio" name="sex">男 
<input type="radio" name="sex" checked>女 
单选按钮必需加上name属性，申明差别的单选按钮是一组的，不然一切单选按钮都可以挑选上。checked默许被选中.

复选框
 兴趣：
 <input type="checkbox">唱歌   
 <input type="checkbox" checked>舞蹈   checked默许被选中
 
下拉框 
 省:<select name="province" id="">
      <option value="">黑龙江</option>
      <option value="">吉林</option>
      <option value="" selected>辽宁</option>
   </select>   
 selected默许被选中,数据传给背景的时刻，传的值是value，不是显现的汉字。

多级下拉框
省:<select name="province" id="">
     <optgroup value="" label="黑龙江">
         <option>哈尔滨</option>
         <option>鹤岗</option>
     </optgroup>
     <optgroup value="" label="吉林">
         <option>吉林</option>
         <option>长春</option>
     </optgroup>
     <optgroup value="" label="辽宁" >
         <option>沈阳</option>
         <option>大连</option>
     </optgroup>
 </select>   
 
文本域 <textarea></textarea>

邮箱：<input type="email">
个人网站：<input type="url">
<input type="submit">
点击提交按钮，会提醒你输入准确的花样

华诞：<input type="date">浏览器自带日历

input框的type范例number、search在挪动端会依据差别的type弹出差别的键盘更适合做差别的事儿。
    原文作者：李钢铁
    原文地址: https://segmentfault.com/a/1190000016038732
    本文转自网络文章，转载此文章仅为分享知识，如有侵权，请联系博主进行删除。
点赞