码迷,mamicode.com
首页 > 编程语言 > 详细

pythonweb HTML入门

时间:2018-04-02 21:42:31      阅读:418      评论:0      收藏:0      [点我收藏+]

标签:数据   ref   大小   标题   list   示例   line   滚动   统一   

HTML入门

概述

  • HTML/CSS/JS

C/S和B/S架构

  • C/S架构

    • client:客户端

    • server:服务器

  • B/S架构

    • browser:浏览器

    • server:服务器

工具

  • 编辑工具:notepad++

  • 测试工具:chrome

原理

  • 浏览器 => 服务器,发送请求,索要相关数据

  • 服务器 => 浏览器,返回数据(响应),然后浏览器解析收到的数据,就会出现相应的效果

  • 组成:HTML、CSS、JS

HTML

  • 说明:超文本标记语言,所见即所得

  • 后缀:.html或.htm,统一使用.html

标签

  • 格式:

    • 双边:<标签名 属性1="值1" 属性2=‘值2‘ 属性3=值3>内容</标签名>

    • 单边:<标签名 属性1="值1" 属性2=‘值2‘ 属性3=值3 />

  • 特点:

    • 成对出现

    • 容错性强

    • 已经预定义

    • 全部小写,注意格式

  • 说明:标签就是HTML的组成部分

全局架构标签

  • 示例:

    <html>
    <!-- 注释 -->
    <head></head>
    <body></body>
    </html>
  • 说明:

    • html:所有的内容都要放在该标签中

    • head:存放头部,如:编码等

    • body:有效的内容,会出现在网页中

  • body属性:

    • text:字体颜色

    • bgcolor:背景色

  • 几乎每个标签都有的属性:

    • class、name、id、style

    • 可以在后面结合css及js使用

字符实体

  • 说明:在html中显示有特殊意义的内容,如:标签相关内容

  • 字符实体:用特定的一串字符代表某一个有特殊意义的字符

  • 示例:


    <: &lt;
    >: &gt;
    空格: &nbsp;
    &: &amp;
  • 参考:http://www.w3school.com.cn

常用标签(文本修饰)

  • h1 ~ h6:字体从大到小,表示标题,h1一个页面中最多一个,不要为了调整字体大小而使用。

  • 加粗:b、strong

  • 斜体:i、cite、em

  • 下划线:u

  • 中划线:s

  • 下标:sub

  • 上标:sup

  • 字体:font

    • size:大小

    • color:颜色

    • face:类型

  • 换行及空格:

    • br:换行标签,一段文本无论多长都不会换行,除非有用于隔断的空白

    • 空格:无论多少个空格,解析后都会变成一个

    • 回车:无论多少个,都会解析成一个空格

常用标签(格式控制)

  • br:换行(单边标签)

  • p:段落

  • hr:分割线(单标标签)

  • marquee:滚动显示

  • pre:原样输出

  • ul:无序列表,每个元素都是li

    • type:disc(实心圆,默认),circle(空心圆),square(实心方块)

  • ol:有序列表,每个元素都是li

    • type:1、a、A、I

    • start:起始位置

练习:

  • 每个标签至少3遍

  • 建议:可以参考网页书写

  • 有精力可以预习(适当的学习几个常用标签),a、img、video、table、form、input

pythonweb HTML入门

标签:数据   ref   大小   标题   list   示例   line   滚动   统一   

原文地址:https://www.cnblogs.com/kiki5881/p/8697764.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!