4 htmlCSS&图像&表格&列表&表单&框架&颜色
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&图像&表格&列表&表单&框架&颜色的更多相关文章
- Unit01: Web概述 、 HTML概述 、 文本处理 、 图像和超链接 、 表格 、 表单
Unit01: Web概述 . HTML概述 . 文本处理 . 图像和超链接 . 表格 . 表单 demo1.html <!-- 声明网页的版本(文档类型) --> <!doctyp ...
- 框架,表格,表单元素,css基础以及基本标签的结合
<head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8&quo ...
- WEB入门二 表格和表单
学习内容 Ø 表格的作用和制作 Ø 表单的制作 能力目标 Ø 掌握表格的创建 Ø 掌握设置表格的常用属性: Ø 理解表单的作用 Ø ...
- HTML&CSS精选笔记_表格与表单
表格与表单 表格标记 创建表格 要想创建表格,就需要使用表格相关的标记 <table> <tr> <td>单元格内的文字</td> ...
- DOM之表格与表单基础分享
我是沐晴,好久不见.马上要放假啦,也是比较的忙. 今天来谈谈表格和表单的基本知识.前期的写的都是比较基础的知识,后期会慢慢增加实例.一起来学习吧. 先看表格,DOM中提供了一些属性,便于我们获取表单节 ...
- BootStrap入门教程 (二) :BASE CSS(排版(Typography),表格(Table),表单(Forms),按钮(Buttons))
上讲回顾:Bootstrap的手脚架(Scaffolding)提供了固定(fixed)和流式(fluid)两种布局,它同时建立了一个宽达940px和12列的格网系统. 基于手脚架(Scaffoldin ...
- css011 表格和表单的格式化
css011 表格和表单的格式化 一. 让表格专司其职 Html中创建一个三行三列的表格 <table> <caption align="bottom" ...
- 第3天:CSS浮动、定位、表格、表单总结
今天学的是浮动.定位.表格.表单等内容,这些是CSS中最容易混淆的知识,有许多小技巧在写代码过程中需要注意.下面是主要知识点: 一.float浮动1.块元素在一行显示2.内联元素支持宽高3.默认内容撑 ...
- 13、Semantic-UI之表格与表单
13.1 定义基础样式表格 在HTML中可以通过table进行表格定义,在Semantic-UI中也可以通过class="ui table"定义表格. 示例:定义基础表格 &l ...
随机推荐
- ssh复制秘钥成功后仍然需要输入密码
执行免秘钥操作 ssh-copy-id -i ~/.ssh/id_rsa.pub lyg@192.168.1.65 被登录机器的文件权限: //用户权限 chmod 700 /home/usernam ...
- C语言中调用运行python程序
C语言中调用运行python程序: Python代码如下: 创建test.py. #!/usr/bin/python3 #test.py import sys x = ]) print x*x 注意: ...
- JS高级---原型的引入,原型添加的方法解决数据共享
原型的引入:解决:通过构造函数创建对象带来的问题,即浪费内存(一个对象开一个内存,多个对象开多个内存) 通过原型来添加方法,解决数据共享,节省内存空间 <script> function ...
- 自编C++游戏
背景 周末无聊,于是编了一个类似于cmd的小玩意. 可是越想越不对劲,所以把它改成了一个小游戏. 信息 语言:DEV_C++ 源代码已公布!! 打败GG 版本:1.0(正式版) 版本:1.5(番外) ...
- The Preliminary Contest for ICPC Asia Xuzhou 2019 K. Center
这题对于能加入最多边缘点的center点,这个点就是最优的center ,对于center点,总共是n^2的,顶多也就1e6,所以直接双重循环就行了, 然后map<pair,set >映射 ...
- php 发送手机验证码
嗯哼,做为一个好的程序猿,一定要给顾客爸爸剁手的时候,充分的告诉他,你剁完手了,所以不只有邮件通知还要有手机短信的通知,今天就来写一下php发送验证码 1.首先我就写了几个个方法,因为配置在后台,直接 ...
- 排序算法大荟萃——希尔(Shell)排序算法
1.基本思想:先取一个小于n的整数d1作为第一个增量,把文件的全部记录分成d1个组.所有距离为d1的倍数的记录放在同一个组中.先再各族中进行直接插入排序,然后取第二个增量d2<d1重复上述的分组 ...
- 【PAT甲级】1079 Total Sales of Supply Chain (25 分)
题意: 输入一个正整数N(<=1e5),表示共有N个结点,接着输入两个浮点数分别表示商品的进货价和每经过一层会增加的价格百分比.接着输入N行每行包括一个非负整数X,如果X为0则表明该结点为叶子结 ...
- python编程出现:expected an indented block错误。
python编程出现:expected an indented block错误. expected an indented block翻译为:应为缩进块. python中没有像C语言使用{}来表示从属 ...
- 2.2.FastDFS-单机拆分版-存储器安装配置
Centos610系列配置 我们在Centos610FastDFS单机模式-FastDFS安装 中已经完成了FastDFS的安装,接下来我们进行FastDFS存储器的安装. 1.找到FastDFS配置 ...