zoukankan      html  css  js  c++  java
  • HTML基础:

    HTML是英文HyperText Markup Language的缩写,即超级文本标记语言,是用于描述网页文档的一种标记语言。
    HTMl是目前网络上应用最为广泛的语言,也是构成网页文档的主要语言。HTML命令可以说明文字、图形、动画、声音、表格、链接等。
    HTML的注释方法 :<!-- html注释 -->
    CSS的注释方法:/* css注释*/
    JS的注释方法:// js的单行注释方式 /* js的多行注释方式*/

    一. HTML概述

    <!DOCTYPE html>
    <html>
      <head>
      <title></title>
      <meta charset="utf-8">
    </head>
    <body>

    <h1>标题标签</h1>
    <h2>加粗换行</h2>
    <h3>字号大小改变</h3>
    <h4>我是越来越小的</h4>
    <h5>我是越来越小的</h5>
    <h6>我是越来越小的</h6>

    </body>
    </html>

    二. HTML页面标签

    标题是通过 <h1>-<h6> ,自带换行

      这些元素实现的效果都是可以叠加的。

    空格:不换行单个空格 &nbsp;,两个普通空格的宽度 &ensp;四个普通空格的宽度 &emsp;
    换行标记<br/>,文档中插入一个简单的换行符,标记后的内容会换至下一行编辑。
    水平分隔线标记<hr/>,标签在 HTML 页面中创建一条水平线。
    段落标记标记<p>...</p>,在标记对中的内容会显示在一个段落里。利用此标记可以对网页中的文字进行段落的结构定义,但不能进行段落格式的定义。
    加粗标记<b>...</b>,浏览器将包含其中的文本加粗显示。
    强调加粗<strong>...</strong>,浏览器把其中的文本用于强调文本,但它强调的程度更强一些。
    下划线标记<u>...</u>,浏览器将包含其中的文本添加下划线。
    斜体标记<i>...</i>,浏览器将包含其中的文本以斜体字或者倾斜字体显示。
    强调斜体标记<em>...</em>,浏览器把其中的文本表示为强调的内容。
    删除线标记<del>...</del>,浏览器将定义文档中已被删除的文本。
    下标标记<sub>...</sub>,标记对中的内容将会以当前文本流中字符高度的一半来显示,但是与当9.前文本流中文字的字体和字号都是一样的

    三. HTML列表


    1. 有序列表 ol

    <ol type=" " start=" "> #type可选择 1,,a,,A,,i,,I,,
      <li>列表内容</li>
      <li>列表内容</li>
    </ol>

    2.无序列表,ul标记符也包含一个常用的

    <ul type="square"> #type属性有,disc实心圆点,,circle空心圆圈,,square方形
    <li>列表内容</li>
    <li>列表知识</li>
    <li>列表介绍</li>
    </ul>

    3.自定义列表 以<dl>标记开始,列表的解释以<dd>开始,列表项目以<dt>开始,。<dd>标记只能用在<dl>标记中使用

    <dl>
    <dd>列表解释</dd>
    <dt>列表项目列表项目</dt>
    <dt>列表项目列表项目</dt>
    </dl>

    四. HTML超链接

    <a href="url" target="target-windows">链接标题</a>
    target属性指定用于打开链接的目标窗口,默认原窗口,可选blank 在新窗口打开。。

    1、内部链接

    将href属性的URL值设置为相对路径,即可。

    2、外部链接

    链接到网站外部的文件,将href属性设置为绝对路径 即可。<a href="https://www.baidu.com/" target="_blank">点击去百度</a>

    3、书签链接 在两个a标签形成的链接,目标位置a的 href为空 有个name=“ ”属性,触发位置的a中href=“name值”,,这就ok了

    触发点: <a href="#a1" >跳到第一块</a>
    <br/>
    目标位置:<a href="" name="a1">第一块</a>

    五. HTML图片标签

    <img src="url" alt="替代文" width="value" height="value" border=“” title=“”/>

    #src属性为必须属性,其他属性为可选项。title:鼠标移上时显示的说明文。

    <img>标记并不是在网页中插入图像,而是从网页上链接显示一幅图像。也可以使CSS设置某元素的背景图像。

    例如:<img src="./58e6e7f6N3407445f.jpg" alt="华为p10" border="5" title="华为p10">

    六. HTML Form表单

    <form name="formName" method="post/get" action="url" > 内容包括下面的所有input项 </form>

    其中:name表单名称,,method表单发送方式,,action表单处理程序提交地址。。

    <input type="控件类型" name="控件名称"/>

    其中:type属性设置控件的类型,可以是text文本框、password密码框、button标准按钮、checkBox复选框、radio单选按钮、file文件筐、reset重置按钮、image图像域、submit提交按钮等。

    <form method="post" action="index.php">

    文本框:  <input type="text" name="username" placeholder="请输入…" minlennght="6" maxlength="12" readonly/> <br/> #最后的也可disabled
    密码框:  <input type="password" name="pass" placeholder="请输入密码!"/> <br/>
    普通按钮: <input type="button" value="普通按钮"> <br/>
    复选框:  篮球<input type="checkbox">足球<input type="checkbox">乒乓球<input type="checkbox"> <br/>
    单选框:  男<input type="radio" name="ra">女<input type="radio" name="ra"> <br/> <!--name的名称相同才能够有单选的效果-->
    文件框:  <input type="file" name="file" /> <br/>
    重置按钮: <input type="reset" value="重置"> <br/>
    图像框:  <input type="image" src="./image/forget.gif" width="" height=""> <br/>
    提交按钮:  <input type="submit" value="注册">

    下拉列表框:<select>

    <option>北京</option> #列表项标记
    <option>上海</option>
    <option>广州</option>
    <option>深圳</option>
    </select> <br/>

    文本域:<br/> <textarea rows="5" cols="10"> </textarea>

    </form>

    ******** ps输入框提示信息除了密码都可以用value,密码框要用placeholder

  • 相关阅读:
    mybatis框架查询用户表中的记录数
    文件的上传和下载
    怎样在一条sql语句中将第一列和第二列加和的值作为第三列的值
    [OS] 进程的虚地址空间
    [网络] TCP/IP协议族各层的协议汇总
    [面试] C++ 虚函数表解析
    [OS] 堆栈、堆、数据段、代码段
    [算法] 并查集概念及其实现
    [OS] 我与大牛的对话!
    [C] int *p[4]与int (*q)[4]的区别
  • 原文地址:https://www.cnblogs.com/li-20151130/p/7722918.html
Copyright © 2011-2022 走看看