博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
Html基础
阅读量:5930 次
发布时间:2019-06-19

本文共 2155 字,大约阅读时间需要 7 分钟。

 

快捷键的认识

Ctrl+c

复制

Ctrl+v

粘贴

Ctrl+a

全选

Ctrl+x

剪切

Ctrl+s

保存

Ctrl+z

返回上一步

Alt+tab

切换软件

   Ctrl+tab

内部的切换

Windows+d

返回桌面

Windows+r(notepad)

运行窗口

Windows+e

打开本地磁盘

 

2 认识大前端

2.1   解决用户体验

2.2  Web(网页)   移动端

2.3  态度

     多做练习

3 认识网页

3.1   网页的组成

     文字,图片,按钮,输入框,视频。。。元素组成。

3.2  Web标准

     W3c(万维网联盟)

     ☞结构标准    html

     ☞表现标准    Css

     ☞行为标准    js

3.3  浏览器介绍

     浏览器就是用来浏览网页得软件。

     360,百度。。。

  

  

 

     内核:渲染引擎

   

 

3.4  浏览器与服务器之间的那点事((✿◡‿◡))

 

 

  Http:浏览器与服务器之间传输消息的一种规范

  https:加密处理

  Url地址:

 

 

4 认识html

4.1   概念

 Hyper   text   markup  language(超文本标记语言)

 

 超文本:能够实现网页跳转的文本(超链接)

 标记: html中的标签

4.2  Html结构

  <! Doctype   html>

  <html>    根标签

      <head>

         <title></title>

      </head>

      <body></body>

  </html>

 

<! Doctype   html>    文档类型

 

 <head></head>   html文档头部分

 

<title></title>  网页的标题

 

 

<body></body>  html结构的主体部分

 

 

Htm:

Html:

后缀名决定文件的打开方式。

4.3  标签的分类

    ☞单标签:只有开始标签没有结束标签

    例如:<! Doctype   html>

 

    ☞双标签:有开始标签和有结束标签

    例如: <body></body>

4.4  标签关系分类

     ☞并列关系(兄弟)

      <head></head>

      <body></body>

     ☞嵌套关系(包含)

      <head>

         <title></title>

      </head>

 

 

 

 

4.5  显示代码结构

 

 

 ☞新建文件

 

 

4.6  常用快捷键介绍

Ctrl+shift+D

快速复制

Ctrl+L

快速选中

Ctrl+鼠标左键

集体输入

    Ctrl+h

查找替换

Ctrl+f

标签查找

Ctrl+shift+↑(↓)

整体移动

 

sublime快捷键使用:

 

5 Html标签介绍

5.1   单标签

      ☞文本注释标签

     

       Ctrl+/

 

      ☞文本换行标签

      

 

     ☞横线标签

      <hr>

    

5.2  双标签

     ☞段落标签

     

 

    ☞标题标签

     注意:标题标签只能     取到数字1-6

    

 

    ☞文本标签

      <font></font>

    

 

   ☞文本格式化标签

        文字加粗显示:   <strong></strong>    <b></b>

            

 

       文字斜体:

        <em></em>     <i></i>

     

 

      文字删除线;

 

 

文字下横线标签:

 

5.3  图片标签(img)

     <img>

    属性:

      Src: 设置显示图片(图片名称或者图片路径)

      Title:用来设置鼠标方到图片上显示的文字

    

 

    Alt:当图盘无法正常显示的时候,对图片的描述

   Width: 用来设置图片宽度

   Height: 用来设置图片高度

 

 

5.4  相对路径

     ☞当图片和文件(html)在同一文件夹中

      

 

       Src属性中直接写上图片名称即可。

 

    ☞当图片在文件(html)的下一级目录中【见自己总结的模型】

     

      Src属性中写上图片所在文件夹名+“/”+图片名称

    ☞当图片在文件(html)的上一级目录中【见自己总结的模型】

    

 

    Src属性中写上  ../图片所在文件夹名+“/”+图片名称

    

5.5  绝对路径

     凡是带有磁盘路径的都是绝对路径或者带有网站地址的也是绝对路径

 例如: D:\a\1.png      

 

 

5.6  超链接(a)

    <a   href=””></a>

    页面跳转

 

 

 

 

  属性:

   Title:   当鼠标放到超链接上显示 的文字

   target="_self"    默认值  网页在当前页面中打开

   target="_blank"   网页在新窗口中打开

   优化的写法:

   

 

5.7  锚链接介绍(a)

    ☞任何一个标签设置id属性,并取值

   

 

    ☞给a标签设置href属性  “#id名称”

    

 

    文字和图片都可以设置超链接。

 

5.8   简单的下载功能

      a标签中通过给href属性设置一个压缩文件,即可实现下载功能。

 

5.9    超链接不跳转到任何页面

   

 

5.10     特殊字符

  

 

6 列表

6.1   无序列表(ul)

       <ul>

               <li></li>  列表项

               <li></li>

                ......

       </ul>

 

 

 属性介绍:

    type="square"     小方块显示

    type="circle"      小圆圈

6.2  有序列表(ol)

 

      <ol>

            <li></li>

                 <li></li>

     </ol>

 

 Type属性:

     A, a ,  i (小写的罗马数字)  I(大写的罗马数字)

 start="3"      li前面的显示从第几个开始

 

6.3  自定义列表(dl)

 <dl>

        <dt></dt>  小标题

        <dd></dd> 列表项

        <dd></dd>

        <dd></dd>

 </dl>

 

 

 

 

 

放置背景音乐。

 

转载于:https://www.cnblogs.com/duanfeng/p/5682417.html

你可能感兴趣的文章
《随笔记录》20170310
查看>>
网站分析系统
查看>>
一站式解决,Android 拍照 图库的各种问题
查看>>
中国HBase技术社区第五届MeetUp ——HBase技术解析及应用实践(深圳站)
查看>>
lsof命令
查看>>
阿里云云计算ACP考试知识点(标红为重点)
查看>>
从零开始来看一下Java泛型的设计
查看>>
嵌入式WiFi芯片价格战已经打响 MCU企业该醒悟了
查看>>
Shell编程基础
查看>>
【矩阵乘法】OpenJ_POJ - C17F - A Simple Math Problem
查看>>
Verify the Developer App certificate for your account is trusted on your device.
查看>>
神经网络- receptive field
查看>>
九度 1376 最近零子序列
查看>>
Shell之Sed常用用法
查看>>
3.1
查看>>
SpringMVC中使用Interceptor拦截器
查看>>
rhel 6 DNS配置权威指南
查看>>
校验表单如何摆脱 if else ?
查看>>
【网络】CentOS6.5下设置静态IP
查看>>
不断学习,实现自己的目标
查看>>