day02HTML_CSS
掌握表单标签
<form action="http://www.baidu.com" method="post">
...
</form>
了解CSS的概念
- 英文缩写 Cascading Style Sheet
- 层叠样式表
- 层叠:层层叠加
- 样式表:样式的集合(属性的集合),不是html的属性,而是CSS的属性
掌握CSS的引入方式(heml和css)
- 通过style标签的属性
<!--通过style属性-->
<div style="border: 1px solid red;">div一</div> - 通过style标签
<head>
<!--通过style标签-->
<style>
div {
border: 1px solid red;
}
</style>
</head> - 通过link标签结合(外部引入)
<link rel="stylesheet" href="../../css/divcss.css" />
- 通过style标签的属性
了解CSS的基本语法和常用的选择器
- 语法规范
{
属性:属性值 属性值
属性:属性值 属性值
}
- 常用选择器
- 标签选择器; 语法: 标签名{css代码}
<style>
/*标签选择器*/
div{
border: 1px solid red;
}
</style> - 类选择器语法: .类名{css代码}
<style>
/*类选择器*/
.divClass{
border: 1px solid red;
} </style> - id选择器;语法: #id名{css代码}
<style>
/*id选择器*/
#divId{
border: 1px red solid;
} </style> - 组合选择器 语法:选择器,选择器{css代码}
/*组合选择器*/
div,span{
border: 1px solid red;
} - 后代选择器 语法:选择器1 选择器2 {css 代码}
- 子代选择器 语法:选择器1>选择器2 {css 代码}:
- 标签选择器; 语法: 标签名{css代码}
- 常用选择器
了解CSS的盒子模型,浮动.
- 设置浮动
<div style="float:left;"></div>
- 设置浮动
- css盒子模型
- margin:外边距
- padding:内边距,里面的元素和边框之间的距离
<!DOCTYPE html>
<html> <head>
<meta charset="UTF-8">
<title></title> </head> <body>
<div style="height: 300px; width: 300px ;border: red solid 1px;">
<div style="background-color: blue; height: 100px;text-decoration: underline; width: 100px; border-style: dashed; margin: 35px; padding: 20PX;"> BBB
中国
</div>
</div> </body> </html>
day02HTML_CSS的更多相关文章
随机推荐
- 解读python中SocketServer源码
在看SocketServer源码之前,先看一个例子: class Base(object): def __init__(self, name): self.name = name self.Testf ...
- ThreadPoolExecutor系列<二、ThreadPoolExecutor 代码流程图>
本文系作者原创,转载请注明出处:http://www.cnblogs.com/further-further-further/p/7681648.html 1.ThreadPoolExecutor代码 ...
- javascript 之数据类型
写在前面 国庆整理资料时,发现刚开始入门前端时学习JS 的资料,打算以一个基础入门博客记录下来,有不写不对的多多指教: 先推荐些书籍给需要的童鞋 <JavaScript 高级程序设计.pdf&g ...
- C# App 中嵌入 Chrome 浏览器
http://www.codeceo.com/article/cefsharp-charp-app-chrome.html http://developer.51cto.com/art/201304/ ...
- 【转】深度分析NandFlash—物理结构及地址传送(以TQ2440开发板上的K9F2G08U0A为例)
K9F2G08U0A是三星公司生产的总容量为256M的NandFlash,常用于手持设备等消费电子产品.还是那句话,搞底层就得会看datasheet,我们就从它的datasheet看起. 这就是 K9 ...
- MySQL索引(1)
所有MySQL列类型都可以被索引,对相关列使用索引是提高SELECT操作性能的最佳途径.根据存储引擎可以定义 每个表的最大索引数和最大索引长度,每种存储引擎(如MyISAM.InnoDB.BDB.ME ...
- RabbitMQ使用详解
刚刚用了,记录下来,以后忘了,方便能够快速想起来. 首先说明,由于RabbitMQ服务端非JAVA,C++语言,当然也就看不懂,所以本文的理解都是过于主观的. 一,RabbitMQ服务端搭建 推荐最好 ...
- Leetcode题解(24)
73. Set Matrix Zeroes 分析:如果没有空间限制,这道题就很简单,但是要求空间复杂度为O(1),因此需要一些技巧.代码如下(copy网上的代码) class Solution { p ...
- 2-SAT问题总结
2-SAT问题总结 2-SAT问题:n个布尔型的变量,给出m个约束条件,约束条件例如:A,B不能同时为真,A,B必须同时为真等. 看了算法入门经典中的解决办法,关于这种解决办法比较容易理解,并且效率也 ...
- ios video标签部分mp4文件无法播放的问题
问题描述: 部分MP4文件在ios的微信浏览器中无法播放,点击播放后缓冲一下之后显示叉,而另外一些mp4文件正常,同时在安卓全部下正常. 分析: h264编码的压缩级别问题导致. 苹果官方文档中对 i ...