zoukankan      html  css  js  c++  java
  • WEB基础知识个人总结

    【学习的网站是主要是W3school,还加上一些其他搜索学习到的内容,仅在博客做个人整理】

     


     HTML

    一、标签——尖括号围成的关键词,成对出现。

    ※使用时必须符合标签嵌套规则

    1.声明

    (1)<!DOCTYPE html>:HTML5文档类型声明

    (2)对于中文网页需要使用 <meta charset="utf-8"> 声明编码

    2.链接

      <a>:链接 【在href属性中指定链接的地址】,在标签里添加文本标签或图片标签。

    •   target属性:target="_blank"时会在新窗口打开文档
    •   name属性:规定锚(anchor)的名称。使用命名锚(named anchors)时,可以直接跳至页面中的某个链接。

    3.布局

    • <div>:块元素,以新行开始和结束。组合其他HTML元素,常与CSS一同使用,可用于对大的内容块设置样式属性。
    • <span>:内联元素,不会以新行开始和结束。

    4.文本

    • <title>:文档标题
    • <h1> - <h6>:html标题
    • <body>:可见的页面内容
    • <p>:普通段落
    • <strong>:粗体文本,强调强调内容
    • <b>:粗体文本
    • <em>:强调内容,浏览器用斜体文本展示
    • <i>:斜体文本
    • <hr /> :创建水平线
    • <br /> :不产生新段落的情况下【换行】
    • <pre>:定义预格式化的文本,保留空格和换行。
    • <abbr title="etcetera">etc.</abbr>:定义缩写或首字母缩略语。把鼠标移至缩略词语etc.上时,可展示完整版本"etcetera"。
    • <q>:定义短的引用。会为 <q> 元素包围引号
    • <blockquote>:定义块引用,插入换行和外边距
    • <del>:删除线
    • <ins>:下划线

    5.多媒体

    • <img />:图像 【图像的名称和尺寸是以属性的形式提供的】,源属性src="图像URL地址",替换为本属性alt="xxx"
    • <video>:定义视频内容
    • <audio>:定义声音内容

        子标签<source>:定义文件所在地

        子标签<track>:定义轨道

    6.序列化列表

    (1)<ul>无序列表标签

    (2)<ol>有序列表标签

      有序、无序列表项均始于 <li>

    (3)<dl>自定义列表标签

    7.表格

      <table> 定义 HTML 表格。
        <tr>:定义表格中的行
        <th>:定义表格中的表头
        <td>:定义表格中的数据(table data)

    8.输入表单

    定义用户输入

    (1)<from>:块级元素,属性name、action、method、enctype

    (2)<input>:type属性、checked预选、name、value页面所显示的值

      type的值类型:

    • text:文本框
    • password:密码框
    • checkbox:复选框
    • radio:单选框
    • button:按钮
    • submit:提交,将表单数据发送到<form>标签中action属性所指值的网页中/向表单处理程序(处理输入数据的脚本的服务器页面)提交
    • reset:重置
    • hidden:

    (3)<datalist>:为 <input> 元素规定预定义选项列表。其id属性必须与<input>标签中的list属性值相同

    (4)<select>:下拉列表,属性name

      子标签<option>:属性name、value、selected

    (5)<textarea>:文本域

    (6)<fieldset>:绘制一个带标题的框

      子标签<legend>:表示标题

    9.画布

    <canvas>

     

    二、元素——从开始标签到结束标签的所有代码。

    • 大多数HTML元素可拥有属性
    • 大多数 HTML 元素可以嵌套(可以包含其他 HTML 元素)

    三、属性——提供了有关 HTML 元素的更多的信息

    ※以名称/值对的形式出现:xxx=“xxx”(若属性值中含有双引号则外围必须使用单引号)

    ※属性在开始标签中规定。

    【HTML参考手册】http://www.w3school.com.cn/tags/index.asp

    1.大多数元素都有的属性名称:

    •  id
    • class

    2.<style> HTML样式 元素属性名称:

    • background-color:背景颜色
    • font-family:文本字体系列
    • color:文本颜色
    • font-size:文本字体尺寸
    • text-align:文本水平对齐方式

    3.<table>元素属性名称:

    • border:表格边框

     


     

    CSS

    一、样式表

    1.外部样式表——当样式需要被应用到很多页面时

    定义外部CSS文件,在<head>标签中使用链接式<link>:

    <head>
    <link rel="stylesheet" type="text/css" href="mystyle.css">
    </head>

    2.内部样式表——单个文件需要特别样式时

    <head>标签中创建一个<style>标签,其中添加CSS代码:

    <head>
    
    <style type="text/css">
    body {background-color: red}
    p {margin-left: 20px}
    </style>
    </head>

    3.内联CSS

    在相关标签中使用style属性:

    <p style="color: red; margin-left: 20px">
    This is a paragraph
    </p>

     二、语法

    1.选择器——需要改变样式的HTML元素

    (1)派生选择器:

    只有<li>元素中的<strong>元素适用:

    li strong {
        font-style: italic;
        font-weight: normal;
      }

    (2)id选择器

    以#定义,只能在每个HTML文档中出现一次

    (3)类选择题

    以.定义

    类名的第一个字符不要使用数字

    2.语法——由属性和值构成,由冒号":"分开

    • color(颜色):值(red)、十六进制颜色值(#FF0000)、RGB值(rgb(255,0,0))
    • background(背景颜色):
    • font-size(字体大小):
    • font-family(字体样式):
    • font-style()
    • font-weight
    • margin()
    • padding()
  • 相关阅读:
    APP端上传文件至服务器后台,WEB端上传文件存储到服务器
    freemarker模板引擎
    JEECG开发总结
    spring的基本配置
    jeecg解析xml文件
    jeecg查询备份
    jeecg 页面标签规则
    jeecg查询分页
    算法实践——改良的求解数独的暴力搜索法
    算法实践——舞蹈链(Dancing Links)算法求解数独
  • 原文地址:https://www.cnblogs.com/ranine/p/10771945.html
Copyright © 2011-2022 走看看