CSS: Cascading Style Sheeet   层叠样式表  cascadig:瀑布

  • html:网页的结构
  • css:网页的外观
  • JavaScript:网页的动作

CSS的使用方式:

  • 内联样式:在HTML元素中使用style属性
  • 内联样式表:在HTML文档头部<head>区域使用<style>元素来包含CSS
  • 外部样式(最好方式):使用外部CSS文件(link标签引入)

HTML图像标签:

常用属性:

  • src: 文件路径
  • alt: 浏览器无法载入图像时显示的信息。
  • hight,width:宽,高
  • border:图像边框
  • align:对齐方式

html表格:

标签:

  • th:table head 表格头,加粗
  • tr: table row 表格行
  • td: table data cell 单元格,一行有几个表格
  • caption:标题(在新版本已经弃用)

属性:

  • border(属性):边框
  • width,hight:宽、高
  • bgcolor:背景颜色
  • background:背景图像,需要提供url
  • bordercolor:边框颜色
  • cellpadding:单元格的边框和内容之间的距离. pad 填充,护垫
  • cellspacing:表格的单元格之间的距离
  • colspan:合并列
  • rowspan:合并行

HTML列表:

  • ol:定义有序列表
  • ul:电仪无序列表
  • li:定义列表列项

HTML区块:

  • 通常使用div和span标签将元素组合起来
  • 大多数HTML元素被定义为块级元素或者内联元素
  • 块级元素在浏览器显示时,通常会以新行来开始,如h1,p,ul,table标签
  • div和span本身皆没有特定的含义,区别是div单独占一行,而多个span之间并不会自动换行

HTML表单:

  • 表单form是一个包含表单元素的区域
  • 表单元素允许用户输入内容,如:文本域textarea、下拉列表select、单选框radio、复选框checkboxes等等

HTML框架:

  • <iframe>标签规定一个内联框架,可以在当前HTML文档中嵌入另一个文档
  • 通过使用框架可以在同一个浏览器窗口中显示 不止一个页面
  • <iframe src="URL"></iframe>  url执行不同的网页

常用属性:

  • height,width:宽高
  • frameborder:定义iframe是否显示边框,当frameborder为0,移除边框
  • class,id,style,title

HTMLframeset标签:(H5不支持)

<html>
<head></head> <frameset border="2" frameborder="1" framespacing="2" rows="20%,*">
<frame src="title.html" noresize scrolling="no">
<frameset border="4" frameborder="1" framespacing="4" cols="30%,*">
<frame src="menu.html" scrolling="auto" noresize>
<frame src="content.html" scrolling="yes" noresize>
</frameset>
</frameset>
</html>
  • frameset:建立框架的标记,将在其中定义各个框架
  • frame src: 指示框架显示内容url地址
  • frameborder-设置边框, 0值表示没有边框
  • border- 修改边框的粗细(由Netscape浏览器使用)
  • framespacing- 修改边框的粗细(由Internet Explorer浏览器使用)
  • name属性命名每个框架
  • noresize不允许用户更改其尺寸
  • scrolling用于设置滚动条是否显示

HTML颜色:

  • HTML采用RGB颜色,通过对红绿蓝三个颜色通道的变化以及他们相互之间的叠加来得到各式各样的额颜色
  • 每个颜色的最小值是0(#00),最大值是255(#FF),16进制,一共有1600万种颜色
  • 颜色名:141个颜色名称是在HTML和CSS颜色规范中定义
  • 17标准颜色:黑色,蓝色,水,紫红色,灰色,绿色,石灰,栗色,海军,橄榄,橙,紫,红,白,银,蓝绿色,黄色
  • 颜色值:#000或#000000或rgb(0,0,0),范围00~FF

4 htmlCSS&图像&表格&列表&表单&框架&颜色的更多相关文章

  1. Unit01: Web概述 、 HTML概述 、 文本处理 、 图像和超链接 、 表格 、 表单

    Unit01: Web概述 . HTML概述 . 文本处理 . 图像和超链接 . 表格 . 表单 demo1.html <!-- 声明网页的版本(文档类型) --> <!doctyp ...

  2. 框架,表格,表单元素,css基础以及基本标签的结合

    <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8&quo ...

  3. WEB入门二 表格和表单

    学习内容 Ø        表格的作用和制作 Ø        表单的制作 能力目标 Ø        掌握表格的创建 Ø        掌握设置表格的常用属性: Ø        理解表单的作用 Ø ...

  4. HTML&CSS精选笔记_表格与表单

    表格与表单 表格标记 创建表格 要想创建表格,就需要使用表格相关的标记 <table>     <tr>     <td>单元格内的文字</td>   ...

  5. DOM之表格与表单基础分享

    我是沐晴,好久不见.马上要放假啦,也是比较的忙. 今天来谈谈表格和表单的基本知识.前期的写的都是比较基础的知识,后期会慢慢增加实例.一起来学习吧. 先看表格,DOM中提供了一些属性,便于我们获取表单节 ...

  6. BootStrap入门教程 (二) :BASE CSS(排版(Typography),表格(Table),表单(Forms),按钮(Buttons))

    上讲回顾:Bootstrap的手脚架(Scaffolding)提供了固定(fixed)和流式(fluid)两种布局,它同时建立了一个宽达940px和12列的格网系统. 基于手脚架(Scaffoldin ...

  7. css011 表格和表单的格式化

    css011 表格和表单的格式化 一.    让表格专司其职    Html中创建一个三行三列的表格 <table> <caption align="bottom" ...

  8. 第3天:CSS浮动、定位、表格、表单总结

    今天学的是浮动.定位.表格.表单等内容,这些是CSS中最容易混淆的知识,有许多小技巧在写代码过程中需要注意.下面是主要知识点: 一.float浮动1.块元素在一行显示2.内联元素支持宽高3.默认内容撑 ...

  9. 13、Semantic-UI之表格与表单

    13.1 定义基础样式表格   在HTML中可以通过table进行表格定义,在Semantic-UI中也可以通过class="ui table"定义表格. 示例:定义基础表格 &l ...

随机推荐

  1. 6485. 【GDOI2020模拟02.25】沙塔斯月光

    题目描述 题解 镇♂男则反 如果没有操作3很好办,反着做维护操作1的次数即可 实际上一次操作3的贡献是zi*(∑i到操作1位置的距离) 维护一下即可O(n^4) code #include <b ...

  2. 【10】DP青蛙跳台阶

    一只青蛙一次可以跳上1级台阶,也可以跳上2级台阶.求该青蛙跳上一个 n 级的台阶总共有多少种跳法. 答案需要取模 1e9+7(1000000007),如计算初始结果为:1000000008,请返回 1 ...

  3. * ./common/http.js in ./node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_modules/babel-loader/lib!./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader/lib??vue-loader-opt

    vue项目报错如下,找到原因之后,其实超简单,请看: 原来是引入文件路径出现问题,想起刚刚引入了一个文件,一修改,果然药到病除! ----------------------------------- ...

  4. 基于bs4库的HTML内容查找方法

    一.信息提取实例 提取HTML中所有的URL链接 思路:1)搜索到所有的<a>标签 2)解析<a>标签格式,提取href后的链接内容 >>> import r ...

  5. C语言学习建议!8年编程开发经验

    C语言是几乎所有编程语言的先驱与灵感的来源,Perl,PHP,Python和Ruby都是用它写的,同样什么Microsoft Windows,Mac OS X,还有GNU/Linu这些操作系统,都是靠 ...

  6. AC自动机讲解超详细

    begin:2019/5/2 感谢大家支持! AC自动机详细讲解 AC自动机真是个好东西!之前学KMP被Next指针搞晕了,所以咕了许久都不敢开AC自动机,近期学完之后,发现AC自动机并不是很难,特别 ...

  7. socketserver模块(实现并发)

    socketserver模块(实现并发) 一.基于UDP协议实现的并发 # 服务端 import socketserver class MyServer(socketserver.BaseReques ...

  8. Java将数据进行分组处理

    将传人的数据进行分组,使用map保存每组的数据. /** * 将取出的数据进行分组 * @param list * @return */ public Map<Integer,Object> ...

  9. zookeeper基本使用

    (1)查看节点信息:ls / (2)查看单个节点的状态:stat /zookeeper (3)在Java中使用的zk客户端:zkClient,curator (4)curator是apache的开源的 ...

  10. dp(小猪存钱罐)

                      B - Piggy-Bank 在acm能够做任何事情之前, 必须编制预算并获得必要的财政支持.这一行动的主要收入来自IBM.这个想法其实很简单,每当一些会员有一点小 ...