HTML 基础 1

1. 文件结构:
    HTML文件的固定结构:
    <html>
        <head>...</head>
        <body>...</body>
    </html>
    html是根标签
    head定义文档头部,包含: title, script, style, link, meta
    body是网页主要内容,包含:h1,h2-h6, p, a, img

2. 认识head标签:
    <head>
        <title>...</title>         网页标题
        <meta>
        <link>
        <style>...</style>
        <script>...</script>
    </head>

3. 语义化:
    明白每个标签的用途(在什么情况下我可以使用这个标签才合理)
        比如,网页上的文章的标题就可以用标题标签,
        网页上的各个栏目的栏目名称也可以使用标题标签。
        文章中内容的段落就得放在段落标签中,在文章中有想强调的文本,就可以使用em标签表示强调等等。

4. 认识body标签:
    <p>段落文本</p>              有三段就放三个<p></p>
    <h1>标题文本</h1>            h1-h6共6个标题分级
    <em>斜体文本(强调)</em>    斜体文本内容
    <strong>粗体文本</strong>    粗体显示文本内容
    <span>单独样式文本</span>    没有语义的,它的应用就是为了 设置单独的格式用的
    <q>引用的文本</q>            引用的文本内容,会自动加上双引号
    <blockquote>大段引用</blockquote>    引用大段的文本内容,文本前后会加上缩进
    <br/>                        换行
    <hr/>                        水平横线
    &nbsp;                       空格
    <address>地址信息</address>  地址信息,通常用于公司地址显示
    <code>代码内容</code>        代码,通常是一行内
    <pre>多行代码</pre>          多行代码,你需要在网页中预显示格式时都可以使用它
    <ul>                         ul-li 列表信息,以圆点显示
      <li>信息1</li>
      <li>信息2</li>
       ......
    </ul>
    <ol>                         ol-li 列表信息,带上序号
       <li>信息</li>
       <li>信息</li>
       ......
    </ol>
    <div>排版内容<div>           排版中使用,相当于一个容器
                                 确定逻辑部分:逻辑部分是页面上相互关联的一组元素,如栏目版块
    <div id="版块名称">…</div>  div 带上ID号,使之更清晰
    <table>表格内容</table>      创建表格
        <caption>标题文本</caption>         为表格添加标题文本
        <tbody>...</tbody>       若加此标签后,表格会一次性显示出来(而非网页加载一点显示一点)
        <tr>表格一行</tr>        表格中的一行
        <td>表格单元格</td>      表格中的一个单元格
        <th>表格表头</th>        表格头部的一个单元格,表格表头
    <table summary="表格摘要">...</table>    为表格添加摘要,但不会被浏览器显示出来
    <a href="目标网址" title="鼠标滑过时显示文本">链接显示文本</a>    链接标签
        target="_blank"           网页将在新窗口中打开
        mailto:                   网页中邮件地址,可带多个参数
            mailto: 邮箱地址
            cc=     抄送地址
            bcc=    密抄地址
            ;       多个邮箱地址
            subject=邮件主题
            body=   邮件内容
        完整举例: <a href="mailto:[email protected] [email protected] &[email protected] &subject=主题 &body=邮件内容">发送邮件</a>
    <img scr="图片地址" alt="下载失败时替换文本" title="提示文本" />

5. 与用户交互:
    语法:
        <form method="传送方式" action="服务器文件"></form>
    举例:
        <form    method="post"   action="save.php">
            <label for="username">用户名:</label>
            <input type="text" name="username" />
            <label for="pass">密码:</label>
            <input type="password" name="pass" />
        </form>
    表单控件:
        文本框、文本域、按钮、单选框、复选框
    method:
        post/get
    1. 文本框(文本/密码)
        <form>
           <input type="text/password" name="名称" value="文本" />
        </form>
        type:有“text”和“password”两种类型
        name:为文本框命名,方便后台ASP和PHP使用
        value:文本框默认值,一般起提示作用
    2. 文本域(多行文本)
        <textarea rows="行数" cols="列数">默认文本内容</textarea>
        cols:多行输入域的列数
        rows:多行输入域的行数
    3. 单选框、复选框
        <input   type="radio/checkbox"   value="值"    name="名称"   checked="checked"/>
        type:radio单选,checkbox复选框
        value:提交数据到服务器的值,后台PHP处理使用
        name:为控件命名,以备后台程序ASP和PHP使用
        checked:checked="checked"时,此选项默认被选中
        注意:同一组的单选按钮,name取值一定要一致
    4. 下拉列表框
        <form action="save.php" method="post" >
            <label>爱好:</label>
            <select multiple="multiple">
              <label for="book>看书</label>
              <option value="看书" id="book">看书</option>
              <option value="旅游">旅游</option>
              <option value="运动">运动</option>
              <option value="购物">购物</option>
            </select>
            <input   type="submit"   value="提交">
            <input   type="reset"    value="重置"  />
        </form>
        value:向服务器提交值
        selected:设置selected="selected"时,默认选中
        multiple:multiple="multiple"时,可以使用Ctrl多选,但很丑
        label:为了改进鼠标易用性,鼠标点击文本时,选择上Radio
时间: 2024-11-10 00:07:12

HTML 基础 1的相关文章

java web 开发三剑客 -------电子书

Internet,人们通常称为因特网,是当今世界上覆盖面最大和应用最广泛的网络.根据英语构词法,Internet是Inter + net,Inter-作为前缀在英语中表示“在一起,交互”,由此可知Internet的目的是让各个net交互.所以,Internet实质上是将世界上各个国家.各个网络运营商的多个网络相互连接构成的一个全球范围内的统一网,使各个网络之间能够相互到达.各个国家和运营商构建网络采用的底层技术和实现可能各不相同,但只要采用统一的上层协议(TCP/IP)就可以通过Internet

Java注解(1)-注解基础

注解(Annotation)是在JAVA5中开始引入的,它为在代码中添加信息提供了一种新的方式.注解在一定程度上把元数据与源代码文件结合在一起,正如许多成熟的框架(Spring)所做的那样.那么,注解到底可以做什么呢? 1.注解的作用. 提供用来完整地描述程序所需要的信息,如编译期校验程序信息. 生成描述符文件,或生成新类的定义. 减轻编写"样板"代码(配置文件)的负担,可以使用注解自动生成. 更加干净易读的代码. 编译期类型检查. 2.Java提供的注解 Java5内置了一些原生的注

MySQL数据库基础知识

day02 MySQL数据库基础知识 一.基础知识概述: 基础决定你这门课程的学习成败!只有学习好这些基础知识以后,你才能真正的运用自如.才能够对数据库有更深入的了解,道路才会越走越远. 二.基础知识: 1.数据库(database):数据库就好比是一个物理的文档柜,一个容器,把我们整理好的数据表等等归纳起来. 创建数据库命令:        create database 数据库名; 2.查看数据库         show databases; 3.打开指定的数据库         use 

【Linux系列】【基础版】第四章 Shell基础之正则表达式

4. Shell基础之正则表达式     4.1 正则就是一串有规律的字符串         4.1 grep              4.1.1 格式: grep [-cinrvABC] 'word' filename             4.1.2 -c //count,表示行数             4.1.3 -i //不区分大小写             4.1.4 -n  //显示行号             4.1.5 -r  //遍历所有子目录             4

NumPy基础:数组和失量计算

NumPy : Numerical Python,是高性能科学计算和数据分析的基础包. 部分功能: ndarray:一个具有矢量算术运算和复杂广播能力的快速且节省空间的多维数组: 用于对整组数据进行快速运算的标准数学函数(无需编写循环): 用于读写磁盘数据的工具以及用于操作内存映射文件的工具: 线性代数.随机数生成以及傅里叶变换功能: 用于集成C.C++.Fortran等语言编写的代码工具: 大部分数据分析应用关注的功能: 用于

css基础

css绝对是一个能够写到爆炸的东西,so,机智的小北方才不会写各种css样式具体的效果,相比之下更推荐大家记一些常用的key,至于效果,每次用的时候百度下就可以了, css的作用是对符合条件的标签进行渲染,那么首先就要匹配到对应标签啦,我萌有三种基础的模式来匹配希望改变样式的标签 1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8">

零基础的人该怎么学习JAVA

对于JAVA有所兴趣但又是零基础的人,该如何学习JAVA呢?对于想要学习开发技术的学子来说找到一个合适自己的培训机构是非常难的事情,在选择的过程中总是 因为这样或那样的问题让你犹豫不决,阻碍你前进的步伐,今天就让小编为您推荐培训机构新起之秀--乐橙谷Java培训机构,助力你成就好未来. 选择java培训就到乐橙谷 北京有什么好的Java培训机构?来乐橙谷北京学Java,零基础走起,乐橙谷Java基础班授课老师经验非常丰富,课程内容安排合理,适合于有一点点Java基础甚至一点都不会Java的同学学

linux+jmeter+python基础+抓包拦截

LINUX 一 配置jdk 环境 *需要获取root权限,或者切换为root用户 1.windows下载好,去 http://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.html 官方网站下载jdk(linux相应版本) 2.在usr目录下创建java路径文件夹 [root bin]cd /usr mkdir java 3.将jdk-8u60-linux-x64.tar.gz放到刚才创建的文件夹下

python基础之条件循环语句

前两篇说的是数据类型和数据运算,本篇来讲讲条件语句和循环语句. 0x00. 条件语句 条件语句是通过一条或多条语句的执行结果(True或者False)来决定执行的代码块. 可以通过下图来简单了解条件语句的执行过程: Python interprets non-zero values as True. None and 0 are interpreted as False. Python 判断非0的值为 True, 而None和0被认为是 False.注意这里的True和False首字母大写,Py

【转】Java基础知识总结

写代码: 1,明确需求.我要做什么? 2,分析思路.我要怎么做?1,2,3. 3,确定步骤.每一个思路部分用到哪些语句,方法,和对象. 4,代码实现.用具体的java语言代码把思路体现出来. 学习新技术的四点: 1,该技术是什么? 2,该技术有什么特点(使用注意): 3,该技术怎么使用.demo 4,该技术什么时候用?test. ------------------------------------------------------------------------------------