HTML的小知识点

 ·HTML是网页内容的载体:内容就是网页制作者放在页面上想要让用户浏览的信息,可以包含文字,图片,视频等

常用的8个标签:
·<h*></h*>:标题标签,h1-h6,
·<p></p>:段落标签
·<ul></ul>:无序列表(<ol></ol>:有序列表)(<dl></dl>:自定义列表)
·<li></li>:列表元素
·<a></a>:超链接,href属性可以指定跳转的位置
·<img>:图卡,src属性可以设置图片源文件
·<div></div>:容器,了解css之后再进一步理解容器的概念
·<span></span>:该标签是没有语义的,它的作用就是设置单独的样式用的(并非强调,只是和其他文字不同样式)

补充标签:
·<em></em>:强调一句话中的关键字(斜体字)
·<strong></strong>:强调更强(加粗)
·<q></q>:引用简短文本(使用后,不用加"",浏览器会自动加上)
·<blockquote></blockquote>:对长文本的引用(使用后,会自动缩进)
·<br/>:换行符(<br/>标签是一个空标签)
·<hr/>:分隔符(<hr/>标签也是一个空标签)
·<address></address>:地址信息
·<code></code>:代码语言
·<pre></pre>:预显示格式(一般用在大段代码时候,会保留代码中的空格和换行)(作用:预格式化的文本,被包围在pre元素中的文本通常会保留空格和换行符)
              
·<i>标签:
        显示斜体文本效果
        <i>标签告诉浏览器将包含其中的文本以斜体字(italic)
        或者倾斜(oblique)字体显示;
·<em>标签:
        <em>标签中的文本表示为强调的内容,对于所有浏览器的显示效果来说,
        是把这段文字用斜体来显示;
        当引入新的术语或在引用特定类型的术语或概念时作为固定样式的时候,
        也可以考虑使用 <em> 标签。
(说明:<i> 标签一定要和结束标签 </i> 结合起来使用;<em>标签也要和结束标签</em>结合使用。)

·注释:
<!--注释语句-->


·空标签:
   没有HTML内容的标签就是空标签,空标签只需要写一个开始标签,这样的标签有<br/>,<hr/>,<img/>
·HTML中是忽略回车和空格的
·要输入空格,必须写入&nbsp;


·eg:<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>了不起的盖茨比</title>
meta是html中的元标签,其中包含了对应html的相关信息,客户端浏览器或服务器端的程序会根据这些信息进行处理。
HTTP-EQUIV类似于HTTP的头部协议,它回应给浏览器一些有用的信息,以帮助正确和精确地显示网页内容。


content(内容类型):重要!!这个网页的格式是文本的,网页模式
charset(编码):特别重要!!!这个网页的编码是utf-8,中文编码,需要注意的是这个是网页内容的编码,而不是

·创建表格的四个元素:
   table,tbody,tr,th,td
   ·<table></table>:整个表格以<table>标记开始,</table>标记结束
   ·<tbody></tbody>:如果不加<thead>,<tbody>,<tfooter>,table表格加载完才显示,
     加上这些表格结构,tbody包含行的内容下载完优先显示,不必等待表格结束后再显示,同时,如果表格很长
     用tbody分段,可以一部分一部分的显示
   ·<tr></tr>:表格的一行,所以有几对tr,表格就有几行
   ·<td></td>:表格的一个单元格,一行中包含几对<td></td>,说明一行就有几列
   ·<th></th>:表格头部的一个单元格,表格表头


·使用表单标签,与用户进行交互:
   <form method="传送方式" action="服务器文件">
       <label></label>
       <input></input>
   </form>


·label是用来定义表单控制间的关系,是一个闭合标签,
   label标签不会向用户呈现任何特殊效果,
   它的作用是为鼠标用户改进了可用性。
   如果你在 label 标签内点击文本,就会触发此控件。
   就是说,当用户单击选中该label标签时,
    浏览器就会自动将焦点转到和标签相关的表单控件上
  (就自动选中和该label标签相关连的表单控件上)。
  语法:
   <label for="控件id名称">


  input是表单的一个属性,可以用来接收用户输入的文字,是一个自闭合标签,
  闭合标签用<>表示标签开始,</>表示标签结束,
  自闭合标签<>只有一个组成,用"/"闭合,
  ps: html5中自闭合标签可以省略"/".
·type:
   ·当type = "text"时,输入框为文本输入框
   ·当type = "password"时,输入框为密码输入框
·name:为文本框命名,以备后台程序ASP、PHP使用
·value:为文本框设置默认值(一般起提示作用)




·多行输入:文本输入域(在<form></form>标签中):
   <textarea rows="行数" cols="列数">文本</textarea>


·使用单选框,复选框来让用户进行选择:
   <input type="radio/checkbox" value="值" name="名称" checked="checked"/>
   
    ·当type="radio",为单选框
    ·当type="checkbox",为复选框
    ·checked:当设置checked="checked"时,该选项被默认选中,也可直接设置为checked=true(同理,不选,即为checked=false)
    ·同一组的单选按钮,name取值一定要一致,这样同一组的单选按钮才可以起到单选的作用
    ·value:为提交到服务器的值(后台程序使用)
    ·name:为控件命名,以备后台程序使用




·下拉表框:
  ·单选
<select>
   <option value="提交值1" selected="selected">选项1</option>
   <option value="提交值2">选项2</option>
   ...
</select>
·当selected="selected"属性时,该选项就被默认选中


  ·多选:
<select multiple="multiple">
   <option value="提交值1" selected="selected">选项1</option>
   <option value="提交值2">选项2</option>
   ...
</select>
(Ctrl+单击,选择多个选项)

·使用表单中的提交按钮,提交数据
<input type="submit" value="提交"/>

只有当type值为submit时,提交按钮才有提交作用


猜你喜欢

转载自blog.csdn.net/yvonne_lu7/article/details/80417969