HTML和CSS 入门系列（二）：文字、表单、表格、浮动、定位、框架布局、SEO
上一篇：HTML和CSS 入门系列（一）：超链接、选择器、颜色、盒模式、DIV布局、图片
一、文字
1.1 属性
1.2 字体样式：font-family
1.3 字体大小：font-size
1.4 字体粗细：font-weight
1.5 字体风格：font-style
1.6 行高：line-height
二、表单
点击文字自动关联：
三、表格
四、浮动
4.1 清除浮动
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<style type="text/css">
.d-parent{
border: 10px solid green;
width: 540px;
}
.d-float{
float: left;
border: 10px dotted orange;
margin: 10px;
padding: 10px;
width: 120px;
}
.clear{
clear: both;
}
</style>
</head>
<body>
<h1>清除浮动</h1>
<div class="d-parent">
<div class="d-float">d-float：现在 .d-float标签的高度是120px，但是有时候，我们不想明确指定浮动元素的高度，想让它们的内容决定它们的高度。</div>
<div class="d-float">d-float</div>
<div class="d-float">d-float</div>
<div class="clear"></div>
</div>
</body>
</html>
overflow: hidden; 多余的文字会被隐藏五、定位
透明度：a: 0 ~ 1
background-color: rgba(138, 32, 10, 0.75);div居中显示：
margin: 0 auto堆叠顺序：
z-index 可用于将在一个元素放置于另一元素之后。六、HTML框架布局
6.1 垂直布局
6.2 水平布局
6.3 内联框架：iframe标签
七、搜索引擎优化
下一篇：HTML5和CSS3系列（三）：变化元素、新增标签、多媒体、新增表单、全局属性
HTML和CSS 入门系列（二）：文字、表单、表格、浮动、定位、框架布局、SEO的更多相关文章
- HTML和CSS 入门系列（一）：超链接、选择器、颜色、盒模式、DIV布局、图片
一.超链接 二.CSS选择器 CSS的全称叫做: Cascading Style Sheets 级联样式表的缩写. 2.1 类型选择器 2.2 派生选择器 2.3 伪类选择器 <style &g ...
- mybatis入门系列二之输入与输出参数
mybatis入门系列二之详解输入与输出参数 基础知识 mybatis规定mapp.xml中每一个SQL语句形式上只能有一个@parameterType和一个@resultType 1. 返回 ...
- C语言高速入门系列(二)
C语言高速入门系列(二) -----转载请注明出处coder-pig 本节引言: 在前面一节中我们对C语言进行了初步的了解,学会了使用IDE进行代码的编写,编译执行! 在这一节中我们会对C语言的基本的 ...
- Maven入门系列(二)--设置中央仓库的方法
原文地址:http://www.codeweblog.com/maven入门系列-二-设置中央仓库的方法/ Maven仓库放在我的文档里好吗?当然不好,重装一次电脑,意味着一切jar都要重新下载和发布 ...
- C# 互操作性入门系列(二)：使用平台调用调用Win32 函数
好文章搬用工模式启动ing ..... { 文章中已经包含了原文链接 就不再次粘贴了 言明 改文章是一个系列,但只收录了2篇,原因是 够用了 } --------------------------- ...
- [转]C# 互操作性入门系列(二)：使用平台调用调用Win32 函数
传送门 C#互操作系列文章: C# 互操作性入门系列(一):C#中互操作性介绍 C# 互操作性入门系列(二):使用平台调用调用Win32 函数 C# 互操作性入门系列(三):平台调用中的数据封送处理 ...
- Bootstrap入门（五）表单
Bootstrap入门(五)表单 先引入本地的CSS文件 <link href="css/bootstrap.min.css" rel="stylesheet ...
- struts2官方 中文教程 系列六：表单验证
先贴个本帖的地址,以免被爬:struts2教程 官方系列六:表单验证 即 http://www.cnblogs.com/linghaoxinpian/p/6906720.html 下载本章节代码 介 ...
- 齐博x1第四季《模块插件的制作》系列21-公共表单器的参数选项（7）
password 密码类型 和text一样,只不过type类型是password,密码类型输入时,显示星号.即Html中的密码框类型 icon 字体图标类型 和列表页一样,把css的字体图标引入到了表 ...
随机推荐
- 牛客挑战赛32E 树上逆序对
nowcoder 口胡一时爽 先从这个逆序对的性质入手,手玩可以发现对于一对具有祖先关系节点的点,只有权值绝对值大的才能对这一对点是否为逆序对造成影响.具体来讲,如果祖先点权值大,并且取正号,那么其后 ...
- sqlalchemy.exc.InternalError: (pymysql.err.InternalError) (1366, "Incorrect string value: '\\xE6\\xB1\\x89\\xE8\\xAF\\xAD...' for column 'className' at row 1") [SQL: INSERT INTO classmessage (`classId
sqlalchemy.exc.InternalError: (pymysql.err.InternalError) (1366, "Incorrect string value: '\\xE ...
- C语言typedef详解
原文链接 C语言允许用户使用 typedef 关键字来定义自己习惯的数据类型名称,来替代系统默认的基本类型名称.数组类型名称.指针类型名称与用户自定义的结构型名称.共用型名称.枚举型名称等.一旦用户在 ...
- leetcode297. 二叉树的序列化与反序列化
代码 /** * Definition for a binary tree node. * public class TreeNode { * int val; * TreeNode left; * ...
- mybatis原理解析
本文是结合spring-mybatis整合进行的分析 1.先看看依赖的jar包: <dependency> <groupId>org.mybatis</groupId&g ...
- 正确的安装和使用nvm(mac)<转>
前言 目前主流的node版本管理工具有两种,nvm和n.两者差异挺大的,具体分析可以参考一下淘宝FED团队的一篇文章: 管理 node 版本,选择 nvm 还是 n? 总的来说,nvm有点类似于 Py ...
- linux上如何安装postgresql
安装对应的postgresql的yum源 rpm -Uvh https://download.postgresql.org/pub/repos/yum/9.4/redhat/rhel-7-x86_64 ...
- Python测开面试题之装饰器
Python的装饰器是面试常被问到的问题之一,在面试Python测试开发时被问到的概率不低于70%,那么装饰器的原理是什么,怎么快速写出一个装饰器呢,接下来我们详细讲解装饰器的实现方法. Python ...
- touch cyusbConfig.cmake
touch cyusbConfig.cmake cmake文件丢失,与其解决问题,不如临时建立一个临时文件
- OCP协议_电信特殊协议
OCP(Online Charging Protocol)协议——在线计费协议(也称为AAA协议),是中国电信(文中以中国电信为主)充分研究国内外在线计费协议,基于中国电信自己在线计费的需求,参考3G ...