A股上市公司传智教育(股票代码 003032)旗下技术交流社区北京昌平校区

 找回密码
 加入黑马

QQ登录

只需一步,快速开始

© hyx_yxyxy 初级黑马   /  2019-10-15 13:13  /  853 人查看  /  0 人回复  /   0 人收藏 转载请遵从CC协议 禁止商业使用本文

                                                                           技术贴
    在这半个月的学习,我学的不怎么明白,头脑里的知识比较混乱,思路不是特别清晰,所以写一个页面的时间比较长,可能是基础没有打牢固,所以发的都是一些html的内容。有一些面试时可能也会遇到,工作也能用得上。
网页的组成:
文字、图片和超链接等元素构成,还包括了音频、视频等等;
常见的浏览器:
作用:浏览器是显示,运行网页的平台;
主流浏览器:IE、火狐(Firefox)、谷歌(Chrome)、safari和Operra,统称5大浏览器
常见浏览器内核
浏览器内核的作用:读取网页内容;
常见的浏览器内核:
IE(Trident)        
Firefox(Gecko)         
safari(webkiit)           
chrome(chromium/Blink)            
Opera(blink)
移动端常见浏览器内核:安卓机器一般都用Webkit内核,ios以及WP7一般都是系统自带浏览器内核,一般是Safari或者Trident内核;

为什么要web标准
由于各个浏览器的内核不同,所以我们要遵循W3C组织制定的web标准让所有浏览器最终显示的效果完全一致‘’
HTML标签分类
双标签:由开始标签<开始标签>和结束标签</结束标签>组成;
例如:<html></html>    <body></body>   <head></head>  
单标签:  不需要包含内容,直接在开始标签最后面添加一个结束的符号/;
例如:<br /> <hr />
注意:双标签就是里面可以包含其他元素的,单标签就不能包含其他元素的;
双标签:h1-h6,p,a,b,strong,u,ins,I,em,s,del,div,span
单标签:<br />  <hr />
HTML标签关系
•        嵌套关系  --- 父子级关系
•        并列关系  --- 兄弟关系
常用的html标签
标题标签H(记住)
标题标签分为6个级别,分别是h1/h2/h3/h4/h5/h6作为标题使用,并且依据重要性递减;
<h1></h1>         <h2></h2>                <h3></h3>
<h4></h4>                <h5></h5>                <h6></h6>
注意:
01、标题标签默认加粗,独自占一行,双标签;
02、h1标签一般情况下一个页面最好出现一次,并且放logo最好,h2标签一个页面最多使用两次,h3-h6标签可以多次重复出现;
表格的常见属性:
  宽:width;   高:height;    边框:border,如果设置border=0是没有边框;
  对齐方式:align  取值left、center、right;设置表格在网页中的水平对齐方式;
  单元格和单元格之间的距离:cellspacing
单元格内容到单元格边框的距离:cellpadding
<table border="1" width="800" align="center" cellpadding="30" cellspacing="0">
表头单元格th
表头单元格是tr嵌套th书写,默认是加粗居中显示的效果;
<tr>
      <th></th>
</tr>


<tr>
            <th>姓名</th>
            <th>年龄</th>
            <th>性别</th>
            <th>爱好</th>
            <th>成绩</th>
        </tr>
表格标题标签caption
Caption标签必须要写在table标签里面,caption标签里面可以嵌套其他的标签

<caption>
            <h2>基本信息表</h2>
        </caption>
  <table width="800">
         <caption>表格标题标签</caption>
              <tr>
                     <th></th>
          </tr>
   </table>

合并单元格
跨行合并:rowspan=“合并单元格的个数”
跨列合并:colspan=“合并单元格的个数”
注意:合并单元格的顺序:先上后下,先左后右;
单元格合并三部曲
01 先确定是跨行rowspan还是跨列colspan;
02 根据先上后下,先左后右的原则找到目标单元格,然后书写合并方式,确定合并单元格的数量;
03 删除多余的单元格;
表格划分结构
比较复杂的表格,表格的结构也就相对的复杂了,所以又将表格分割成三个部分:表头、正文和脚注。而这三部分分别用:
表头:thead
正文:tbody
脚注:tfoot
表格的总结
结构table标签嵌套tr,tr标签嵌套th或者td,tr表示行,th表示表头,td表示列;
table常见的属性:边框border、宽width、高height,单元格和单元格之间的距离cellspacing,单元格里面的内容到单元格边缘的距离cellpadding
form表单域标签(很重要呀)
作用:
在HTML中,form标签被用于定义表单域,以实现用户信息的收集和传递,form中的所有内容都会被提交给服务器。
默认属性:
action=“url地址”   -----  用于指定接收并处理表单数据的服务器程序的url地址。
method=“ 提交方式”  ---- 取值 get/post,get是明文提交,post是密文提交;
name=“名字”  设置不同的取值名称用于后台提交;
注意:一个页面中可能会出现过个form标签,我们需要用添加name属性设置不同的表单名称来区分;
<form action="" method="post" name="表单名称1"></form>
<form action="" method="post" name="表单名称2"></form>
目前为止我们只需要知道我们书写表单元素的时候就要包裹在form中就可以,等后期在给大家详细讲解;

0 个回复

您需要登录后才可以回帖 登录 | 加入黑马