web开发学习笔记

1.网页:通过浏览器才能访问阅读,是网站中的一页,文件扩展名.html。

2.HTML:指的是超文本标记语言(Hyper Text Markkup Language),用来描述网页(包含视频,音频,图片等等)的一种语言,不是编程语言,而是一种标记语言。

3.web(网页)的组成部分:(w3c万维网联盟制定了统一标准)

        3.1 HTML结构

        3.2 CSS表现

        3.3 JS行为 

4.常规标记(双标记),空标记(单标记)。

 5.文件开头:<!DOCTYPE html> (特殊且固定的文档声明标签)告诉浏览器以最新的html5的标准来解析此页面。

6.<html lang="en"> </html> 其中的lang="en" ,表示此段html代码包含的语言是英文(Endlish)的。(en也可以改成其他的,eg:zh-CN代表中文,ja-jp代表日文)

那么浏览器(我的默认设定为中文)在翻译我们的页面的时候,就会认为我们的语言内容是英文的,就会提示是否要将英文翻译成中文

 7.<meta charset="UTF-8">告诉浏览器按照这种方式来解码( "UTF-8"万国码字符编码,相当于一个密码本,可以将不同国家的语言对应到01编码)

8.标题标签:h1-h6 独占一行,自带加粗,爬虫在爬取信息的时候,会认为h1标签的关键字是最想表达的内容,将关键字关联到网页中,h1-h6权重依次降低

 9.段落标签:<p></p> 标识一个段落(段落之间有段间距)

10.换行标签:<br/> (单标签 “/” 可以没有)强制换行

11.水平线标签:<hr/> 一条线 

        属性:颜色color 宽度width 对齐align 取消阴影noshade

        align无参数的时候,默认居中对齐

        eg:

      没有noshade和color的时候 默认具有阴影

        eg:(此图为放大图)

12.加粗标签:<b></b>;<strong></strong> 加粗效果一样,但strong更加突出文本 ,具有强调作用,爬虫更喜欢。一般推荐使用strong

13.倾斜标签:<em></em>强调文本,爬虫更喜欢,推荐使用;<i></i>
14.删除标签:<s></s>;<del></del> 删除线。del具有强调性,推荐使用

15.下划线:<u></u>

16.下标<sub></sub>

17.上标<sup></sup>

18.标签小技巧:先选中区域,按alt+w,会给选中区域自动补上<p></p>,然后将p标签改成我们需要的标签即可

19.特殊符号:因为有一部分符号被认为是html的符号,那么我们要是希望在文本中出现这些符号(eg:'<','>','  ')就比较困难

      左尖角号<:&lt;     

      右尖角号>&gt;   

      空格(1)&nbsp宽度受字体影响(不好用)

             (2)&emsp宽度为一个中文宽度 (这个好用点儿)

      版权:&copy ©

      商标:(1)&trade;™ (提出申请,具有优先使用权,但申请不一定成功)

                 (2) &reg;®(已经申请成功的受保护的商标)

20.生成一堆字符小技巧:lorem+回车

21.div标签:没有具体含义,用来划分页面的区域,独占一行。

22.span标签:没有实际意义,主要应用在对于文本独立修饰的时候(不会破坏页面结构),内容有多宽就占用多宽的空间距离。

23.列表:

紧跟着<ul>/<ol> 的只能是<li>,<li>属于列表的一项 ,<li>里面可以跟其他标签

  23.1有序列表:<ol>自动生成数字 标签的属性type="1/a/A/i/I" ,start="一个数字"

         23.1.1type属性        

                   type="1" 序号1,2,3,...

                         ​​​​​​​        ​​​​​​​        ​​​​​​​        

                   type="a"序号a,b,c,...

        ​​​​​​​        ​​​​​​​        ​​​​​​​        ​​​​​​​        ​​​​​​​        ​​​​​​​   

                   type="A"序号A,B,C,...

        ​​​​​​​        ​​​​​​​        ​​​​​​​        ​​​​​​​        ​​​​​​​        ​​​​​​​    

                   type="i"序号i,ii,iii,...

        ​​​​​​​        ​​​​​​​        ​​​​​​​        ​​​​​​​        ​​​​​​​        ​​​​​​​     

                   type="I"序号I,II,III,...

        ​​​​​​​        ​​​​​​​        ​​​​​​​        ​​​​​​​        ​​​​​​​        ​​​​​​​     

      23.1.2start属性:只能是数字,与type一起使用

                type指明了序号的类型,start指明了从此类型序号的第几个开始

                eg:  

                        type="a" start="4"

        ​​​​​​​        ​​​​​​​        ​​​​​​​        ​​​​​​​        ​​​​​​​        ​​​​​​​        

                        type="i" start="2"

        ​​​​​​​        ​​​​​​​        ​​​​​​​        ​​​​​​​        ​​​​​​​        ​​​​​​​        

                         type="a" start="53"(有意思的点,这里53对应了ba(26*2+1),也就是26进制)

        ​​​​​​​        ​​​​​​​        ​​​​​​​        ​​​​​​​        ​​​​​​​        ​​​​​​​        ​​​​​​​   ​​​​​​​

23.2无序列表:<ul>无数字,每一项前面默认是黑色的实心圆(type="disc")

        23.2.1type属性:disc,circle,square,none

                        type="disc" 黑色实心圆

        ​​​​​​​        ​​​​​​​        ​​​​​​​        ​​​​​​​        

 

                        type="circle"空心圆

        ​​​​​​​        ​​​​​​​        ​​​​​​​        ​​​​​​​        

 

                        type="square"黑色实心正方形

                                         

 

                        type="none"(用的最多的)不显示任何标签   

        ​​​​​​​        ​​​​​​​        ​​​​​​​        ​​​​​​​             

23.3自定义列表:用于图文混排方面

        格式:

        ​​​​​​​        ​​​​​​​        

         一般我们只会在一个自定义列表dl中加入一个单元(包含dt,dd),因为只有一个的话,在后期我们对它进行样式修饰的时候比较方便

24.图片

                               

                               3.

                                       

 24.超链接属性
                                        ​​​​​​​

 25.表格(table后紧跟tr ,tr里面紧跟td,td里面可跟其他标签)

        25.1表格样式

        ​​​​​​​        ​​​​​​​        

 

         25.2表格属性

        ​​​​​​​        ​​​​​​​        

             注意:body的高度实际上是我们填充的内容高度,body的宽度就是我们浏览器界面的宽度

        25.3tr(table row)属性(tr属性对应的都是一整行)

        ​​​​​​​        ​​​​​​​        

        25.4单元格td(table data)属性(td属性对应的都是某一单元格)

                  ​​​​​​​        ​​​​​​​                

                 注意:如果一个单元格设置了宽度/高度,那么它将影响一整列/行     

        25.5表格合并

                25.5.1合并行rowspan,即行跨度

                25.5.2合并列 colspan,即列跨度

26.表单标签

        ​​​​​​​        ​​​​​​​        

                submit:<input type="submit" value="登录">等价于<button>登录</button>

                        其中的value用于给按钮起名字,可以改成其他名字   

                reset:<input type="reset" value="重置信息">等价于

                        <button type="reset">重置信息</button>            ​​​​​​​     

                form属性:method="get/post"  action:用于指定将信息传到哪里

        ​​​​​​​        ​​​​​​​        

                <input type="button" value="">一个最普通的按钮,我们后期可以通过js来实现一些功能

  • 1
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值