zoukankan      html  css  js  c++  java
  • 前端学习之-Html


    Html css js 三者之间的关系:
    html就是在前端页面上展示给用户的效果;
    css就是把展示给用户的页面按照一定的规则给布局起来;
    js就是把布局好的页面效果给动态起来。

    Html就是超文本标记语言,在页面内可以包含图片、链接,甚至音乐、程序等非文字元素。

    html文档树结构图:
    根元素:{head 元素(meta元素,title元素),body元素(div,p,span)}

    什么是标签:
    1,有一对尖角号包裹起来的单词构成;
    2,标签不区分大小写,推荐使用小写;
    3,标签分为2部分,开始标签和结束标签;
    4,自闭和标签;
    5,标签可以嵌套,但是不可以交叉嵌套。


    标签的属性:
    1,通常是以键值对形式出现的. 例如 name="alex";
    2,属性只能出现在开始标签 或 自闭和标签中;
    3,属性名字全部小写. *属性值必须使用双引号或单引号包裹 例如 name="alex";
    4,如果属性值和属性名完全一样.直接写属性名即可. 例如 readonly。


    Head标签:

    Body标签:

    1:基本标签:
    <hn>,<p>,<b>,<strong>
    <strike>,<em>,<sup><sub>
    <br>,<hr>,<div>,<span>
    -----------------------------------------------------------------
    2:图形标签<img>
    src: 要显示图片的路径.
    alt: 图片没有加载成功时的提示.
    title: 鼠标悬浮时的提示信息.
    图片的宽
    height:图片的高 (宽高两个属性只用一个会自动等比缩放.)
    -------------------------------------------------------------------

    3:超链接标签<a>
    <a target=_blank href="www.baidu.com">百度<a/>
    --------------------------------------------------------------
    4:列表标签
    <ul>
    <li><li/>
    <li><li/>
    <ul/>

    <ol>
    <li><li/>
    <li><li/>
    <ol/>

    <dl> 定义列表

    <dt> 列表标题
    <dd> 列表项
    ------------------------------------------------------------------------
    5:<table>标签

    border: 表格边框.
    cellpadding: 内边距
    cellspacing: 外边距.
    像素 百分比.(最好通过css来设置长宽)
    <tr>: table row
    <th>: table head cell
    <td>: table data cell
    rowspan: 单元格竖跨多少行
    colspan: 单元格横跨多少列(即合并单元格)
    <th>: table header <tbody>(不常用): 为表格进行分区.

    -------------------------------------------------------------------------
    6:<form>标签

    1:表单用于向服务器传输数据。
    表单能够包含:input元素,比如文本字段、复选框、单选框、提交按钮等等,
    表单还可以包含textarea、select、fieldset和label元素。

    2:action: 表单提交到哪.一般指向服务器端一个程序, 程序接收到表单提交过来的数据
    (即表单元素值)作相应处理,比如https: // www.sogou.com / web,
    https://www.baidu.com/

    3:method: 表单的提交方式post / get默认取值

    4:<input>:type:text,password,radio,chexkbox,submit,button,file(enctype="multipart/form-data")

    5:<textarea>
    name: 表单提交项的键.
    cols: 文本域默认有多少列
    rows: 文本域默认有多少行

    6:<select>
    name:表单提交项的键.
    size:选项个数
    multiple:multiple

    <option> 下拉选中的每一项 属性:
    value:表单提交项的值. selected: selected下拉选默认被选中
    <optgroup>为每一项加上分组


    7:<fieldest>
    <fieldset>
    <legend>登录吧</legend>
    <input type="text">
    </fieldset>

    8:<label>
    <label for="www">姓名</label>
    <input id="www" type="text">


  • 相关阅读:
    Element-ui前端自定义排序
    elementUI --- el-select 下拉框样式覆盖
    Oracle中,利用sql语句中的函数实现保留两位小数和四舍五入保留两位小数
    ORA-01476: divisor is equal to zero解决方法
    Linux下安装Mysql
    Fastdfs安装
    java基础
    Markdown学习
    Maven构建SpringMVC环境报错“java.lang.ClassNotFoundException: org.springframework.web.servlet. DispatcherSe
    解决IDEA提示Untrusted Server's certificate 证书不可用( Server's certificate is not trusted )
  • 原文地址:https://www.cnblogs.com/g-123456/p/6225778.html
Copyright © 2011-2022 走看看