html 知识汇总与补充

一、html 基本布局

html:   hyperText   markup  language     超文本标记语言


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
    <title>Document</title>
</head>
<body>
    
</body>
</html>

二、接下来,对之前不清楚的概念进行补充:

1.   编码格式

       之前我只是单纯的知道敲代码时要在 head 标签内的 meta 标签内加入 charset=utf-8 ,但其实我们并不清楚为什么

       gb2312 :国家标准第2312条 (只能识别简体中文) 

       gbk : 国家标准扩展版本

     utf-8  : 万国码(所有国家都适用)

2.    xml:lang="en"

     作用:告诉搜索引擎爬虫此文档是关于英文的

3.   百度搜索时关键字的位置

<meta name="keywords" content="注册向导,滚动,表单,jquery" />
<meta name="description" content="演示XHTML、CSS、jquery、PHP案例和示例" />

4.  编程软件 h 标题 h1~h6  一次性输出

  h$*6    结果如下:

<!-- h$*6 -->
<h1></h1>
<h2></h2>
<h3></h3>
<h4></h4>
<h5></h5>
<h6></h6>

                 h${标题}*6   结果如下:

<!-- h${标题}*6 -->
<h1>标题</h1>
<h2>标题</h2>
<h3>标题</h3>
<h4>标题</h4>
<h5>标题</h5>
<h6>标题</h6>

5.   简单样式标签

<strong></strong> :加粗标签

       <em></em>  :斜体标签

       <del></del>  :割线标签 

       <address></address>  :地址标签

6.  “ ” 空格为英文单词分隔符

7.  html编码  $   ;

< 左括号的编码表示方法 :  $lt;
> 右括号的编码表示方法 :  $gt;
8. 单标签

<meta />

<br />

<hr />

9. ol 在工作中基本不用

<!-- ol没什么用 -->
<ol type="1" start="2"><!-- 1/a/A/i/I  排序方式-->
	<li>句子</li>
	<li>句子</li>
	<li>句子</li>
	<li>句子</li>
	<li>句子</li>
	<li>句子</li>
</ol>
10. 各大网页基本都用 ul 分块

<!-- ul大用途 -->
<ul type="circle"><!-- disc:实心圆  circle:空心圆 square:实心方块 --> 
	<li>苹果</li>
	<li>句子</li>
	<li>举行</li>
</ul>
11. img 标签

alt:图片站位符
title:图片提示符 

<img src="猫眼提供地址" alt="地址报错后展示的字" title="鼠标触摸时显示的字"/>
12.   a  标签

功能:1.href: hyperText reference 超文本引用
2.anchor:     锚   #cd
3.打电话,发邮件 

<a href="tel:18327852725" target="_blank">打电话</a>
<a href="mailto:1091314622@qq.com">发邮件</a>
4.协议限定符

<a href="javascript:"></a>

三、  form  表单   (method : get / post)

<form action="发送地址" method="get">

<!-- 帐号,密码框样式 -->
<input type="text" name="username" style="color:#999" value="请输入用户名" 
οnfοcus="if(this.value=='请输入用户名'){this.value='';this.style.color='#424242'}" 
οnblur="if(this.value==''){this.value='请输入用户名';this.style.color='#999'}"/>
<input type="password" name="password"/>


<!-- 单选框:同一个name -->
1<input type="radio" name="star" value="1" checked="checked"/>
2<input type="radio" name="star" value="2"/>
3<input type="radio" name="star" value="3"/>



<!-- 复选框:同一个name -->
1<input type="checkbox" name="star" value="1" checked="checked"/>
2<input type="checkbox" name="star" value="2"/>
3<input type="checkbox" name="star" value="3"/> 


<!-- 下拉表单 -->
<select name="province" id="">
<option value="beijing">beijing</option>
<option value="shanghai">shanghai</option>
<option value="tianjin">tianjin</option>
</select>

<!-- 提交按钮 -->
<input type="submit"/>
</form>


四、 当今社会的主流浏览器

浏览器主要看两个方面:  shell  (Linux  开发,展示页面)  ,   内核  (相当重要) 。

所以大家应果断卸载360 。

   浏览器                          内核   

	IE                  trident
	Firefox             Gecko
	Google chrome       Webkit
	Safari              Webkit
	Opera                Presto
               





评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值