html表单
**action**表示要将接受的信息传往那个页面。 **method** 有get 和post两个方法。默认是get方法。 **name**为我们为他起的名称。form之间放置输入框 按钮等
输入框常用 input方法
type中为设置的类型 有 text button submit等
label标签 点击该标签可以跳到对应位置
<label for="in">你来啊!</label>
<input type="text" id="in"/>
在点击你来啊时,可以跳到输入框。
css选择器
类选择器 class="ss"
在style中可以通过 .ss{ …} 的方式对ss元素处理
标签选择器
在style中可以通过 a{…} 的方式对a标签处理
id选择器 id="ss"
在style中可以通过 #ss{ …} 的方式对ss元素处理
通配符选择器
在style中可以通过 *{} 的方式对所有元素处理
各个选择器之间可以配合使用
css文本属性设置
front-family设置文本字体
front-size设置字号大小
line-height 行间距
front-weight设置文字粗细
front-style设置字体样式 normal italic斜体
front复合属性 front:style weight size/line-height family
.test{
/*front符合属性*/
front:italic 3px 4px "microsoft";
}
clore文本颜色
text-align 文本对齐
text-decoration 文本装饰 none 无下划线 underline下划线
text-indent 文本缩进
CSS引入方式
行内样式表
<a href="#" style="display:inline-block">内部样式表</a>
内部样式表
.test{
/*front符合属性*/
front:italic 3px 4px "microsoft";
}
外部样式表
新建一个css文件,将选择器放入其中
在html中链入 <link rel="stylesheet" href="xxxx.css">
Emment语法
选择器二
后代选择器(可以是子类或孙子后代)
<style>
ul li{
text-align: center;
font-size: 3px;
color: pink;
}
</style>
<ul>
<li>你好啊 </li>
<li>你好啊 </li>
<li>你好啊 </li>
<li>你好啊 </li>
</ul>
子选择器(只能是子类)
<style>
ul>li{
text-align: center;
font-size: 3px;
color: pink;
}
</style>
<ul>
<li>你好啊 </li>
<li>你好啊 </li>
<li>你好啊 </li>
<li>你好啊 </li>
</ul>
并集选择器
<style>
ul>li,.bar a{
text-align: center;
font-size: 3px;
color: pink;
}
</style>
<ul>
<li>你好啊 </li>
<li>你好啊 </li>
<li>你好啊 </li>
<li>你好啊 </li>
</ul>
<div class="bar1">
<a href="#" style="display:inline-block">内部样式表</a>
<a href="#">五彩导航栏</a>
<a href="#">五彩导航栏</a>
<a href="#">五彩导航栏</a>
<a href="#">五彩导航栏</a>
</div>
链接伪选择器(当光标在链接上方时)
<style>
a:hover{
text-align: center;
font-size: 3px;
color: pink;
}
</style>
<div class="bar1">
<a href="#" style="display:inline-block">内部样式表</a>
<a href="#">五彩导航栏</a>
<a href="#">五彩导航栏</a>
<a href="#">五彩导航栏</a>
<a href="#">五彩导航栏</a>
</div>
focus伪选择器(获取获得焦点的表单元素)
元素显示模式
块元素(一行只能一个)
行内元素(一行有多个,不能设置大小)
行内块元素(一行多个,可以设置大小)
显示模式的转换
display:inline-block/inline/block