html常用笔记

  1 <?php
  2 //CSS可以对文本格式进行精确的控制
  3 //HTML标记更有利于搜索引擎
  4 
  5 //一、标签
  6 <br>
  7 <p>//换行后插入一个空行,单字节不换行,双字节自动换行
  8 <center>//使内容相对于上一层标记居中对齐
  9 <pre>//保留文字在源代码中的格式
 10 <li>//列表
 11 <ul>//无序列表
 12 <ol type="a"><ol type="A"><ol start="N">//有序列表
 13 <hr>//水平分隔线
 14 <nobr>//不换行
 15 <blockquote>//块引用 两边留白
 16 
 17 <h1--h6>//标题标签,自动换行,并插入一空行
 18 <b> <i> <u> <sub> <sup> <tt> <cite> <em> <strong> <small> <big> <font color="red" face="Arial" size="7">文字size7为最大</font>
 19 
 20 //<body>标签的属性
 21 <body class="" name="" id="" style="" leftmargin="10" topmargin="10" text="yellow" bgcolor="gray" link="red" alink="red" vlink="red" background="image/pic.gif" bgproperties>
 22 //二、描点
 23 <a name="md">描点</a>
 24 <a href="#md">连接到描点</a>
 25 <a href="md.html#md">连接到其它锚点</a>
 26 
 27 
 28 //三、连接
 29 <a href="www.baidu.com" target="_blank" title="凤姐"><img src="./img/fj.jpg"></a>
 30 <a href="mailto:unifyyeteng@126.com">发邮件给我</a>
 31 
 32 
 33 //四、热点区域
 34 <img src="img/fj.jpg" border="0" usemap="#z">
 35 <map name="z">
 36     <area shape="rect" coords="x1,y1,x2,y2" href="http://www.baidu.com" target="_blank">
 37     <area shape="circle" coords="x1,y1,bj" href="http://www.google.com" target="_self">
 38 </map>
 39 
 40 
 41 //五、表格
 42 <table border="0" width="100" height="100" align="center" cellspacing="1" cellspadding="1" bordercolorlight="red" bordercolordark="blue">
 43 <caption>居中</caption>
 44 <tr>
 45 <td align="center" valign="middle" width="" height="" border="" colspan="1" rowspan="1" nowrap="true">//默认不换行只对td生效,如果未设置TD宽度是不生效的
 46 
 47 //六、frameset分帧    advert:不要在分帧页面中有任何body标签有关的内容,不然会显示空白,或显示body的内容而不显示分帧
 48 //比如想在左窗口打开右窗口就建一个left.html输入<a href="www.baidu.com" target="ismain">把百度在右窗口打开</a>
 49 //target="_parent"找上一级
 50 //target="_top"找最顶级,退出分帧
 51 <frameset rows="20%,*" frameborder="0">//1为有边框//0为无边框//或border="n"
 52     <frame src="top.html" name="istop">
 53     <frameset cols="30%,*">
 54         <frame src="left.html" name="isleft">
 55         <frame src="main.html" name="ismain">
 56     </frameset>
 57 </frameset>
 58 
 59 //iframe分帧    可有body体.    advert:对搜索引擎不友好,少用.
 60 <body>
 61     iframe可加body体
 62     <a href="http://www.jike.com" target="baidu">百度</a>
 63     <iframe name="baidu" src="http://www.baidu.com" width="" height="" scrolling="no" noresize></iframe>//scrolling属性:yes.no.auto
 64 </body>
 65 
 66 
 67 //七、表单
 68 //一、action=""或"#"等于提交到当前页
 69 //二、method默认为get代表浏览器传参    post通过header头传参advert:可通过firebug[f12]查看传参内容
 70 <form action="www.baidu.com" method="post">
 71     <input type="text" name="username" value="默认值" maxlength="16" checked readonly disabled>//文本
 72     <input type="password" name="pwd">//密码
 73     <input type="hidden" name="hid" value="隐藏值">//隐藏
 74 
 75     <input type="radio" name="sex" value="0" id="n"><label for="n">男</label>//单选,name要相同,否则会成多选.
 76     <input type="radio" name="sex" value="1" id="v"><label for="v">女</label>
 77 
 78     <input type="checkbox" name="sz[]" value="0">朋友介绍//多选,以数组方式提交
 79     <input type="checkbox" name="sz[]" value="1">细说php
 80 
 81     <select name="li" size="n" multiple>//列表//size默认1//multiple不赋值,加入后可多选.
 82         <option value="0" selected>内容</option>//selected默认选中
 83         <option value="1">内容</option>
 84         <option>内容</option>//无值则提交内容
 85     </select>
 86 
 87     <textarea name="area" rows="2" cols="10">这里填写默认值</textarea>//内容文本框//标签中间不能有空格回车
 88 
 89     <input type="image" src="xx.jpg">//图片按钮
 90     <input type="button" name="a" value="无提交效果">//无提交效果按钮
 91     <input type="submit" name="sub" value="提交">//提交    advert:按回车不提交value值,必须按按钮
 92     <input type="reset" value="重填">//重填
 93 
 94     <input type="file" name="f">//单文件上传
 95     <input type="file[]" name="fs">//多文件上传
 96 
 97 //八、mata标签
 98     <mata http-equiv="Content-type" content="text/html;charset=utf-8">//字符集
 99     <mata http-equiv="Refresh" content="1"; url="http://www.baidu.com">//刷新后过N秒转到指定网页
100     <meta http-equiv="page-exit" content="revealtrans(duration=3,transition=17)">//关闭效果,在火狐上无效
101     <mata name="keywords" content="php培训,php招生,php视频,php视频教程">//关键字
102     <mata name="Description" content="lamp兄弟连为大家提供最佳专业的php视频,php免费视频,php教学">//描述,介绍
103     <mata name="robots" content="">//是否准许机器人抓取,详细百度查baidu.现在一般用robots.txt 比如:http://www.baidu.com/robots.txt
104     <mata name="Generator" content="lamp兄弟连php专用工具">//
105     <mata name="Author" content="php开发小组">
106     <mata name="Copyright" content="lamp兄弟连php小组版权所有">
107 
108 //九、base标签
109     <base target="_blank">//代表本页所有连接均以_blank方式打开
110 
111     <base href="http://www.baidu.com">//这代表下面的连接的根
112     <img src="img/baidu.jpg">会变为 http://www.baidu.com/img/baidu.jpg
113     <a href="a/n.html">a</a>会变为 http://www.baidu.com/a/n.html    
114 //十、div和span标签
115     div只有换行效果
116     span无任何效果
View Code
原文地址:https://www.cnblogs.com/iz100/p/3182403.html