CSS样式 属性提高
text-align设置文字水平对齐方式,如text-align:center 设置文字水平居中
text-indent设置文字首行缩进,如:text-indent:24px; 设置文字首行缩进24px
font-style设置字体是否倾斜,如:font-style:'normal'; 设置不倾斜,font-style:'italic';设置文字倾斜
font同时设置文字的几个属性,写的顺序有兼容问题,建议按照如下顺序写: font:是否加粗字号/行高 字体;如: font:normal 12px/36px '微软雅黑';
文本属性的连写
格式: font:font-weight font-style font-size/line-height font-family
注意点:
font属性连写中,必须设置font-size 和 font-family 两个属性
font属性连写中,font-size必须放在 font-family前面
其他常用样式属性
list-style 设置无序列表中的小圆点,一般把它设为"无",如:list-style:none
CSS元素溢出
当子元素的尺寸超过父元素的尺寸时,需要设置父元素显示溢出的子元素的方式,设置的方法是通过overflow属性来设置。
overflow的设置项:
1、visible 默认值。内容不会被修剪,会呈现在元素框之外。
2、hidden内容会被修剪,并且其余内容是不可见的,此属性还有清除浮动、清除margin-top塌陷的功能。
3、scroll 内容会被修剪,但是浏览器会显示滚动条以便查看其余的内容。
4、auto 如果内容被修剪,则浏览器会显示滚动条以便查看其余的内容。
列表与表单
有序标签orderlist
- 基本用法
-
-<ol>
- <li>列表内容</li>
- <li>列表内容</li>
- .....
- </ol>
- 快速构建表格的快捷键 ol>(li>a)*4
无序标签 unorderlist -->经常使用
-<ul>
- <li>列表内容</li>
- <li>列表内容</li>
- </ul>
系统自带的左边的小图标,浏览器版本不一样显示也不一样;故一般都是取消系统样式(CSS),自定义左边的小图标type属性
type = 默认disc 小圆点 circle 小圆圈 square 方形
定义列表 dl defination list
```<!-- 定义列表: define list
dd defination description 内容
dt defination title 标题
-->
<dl>
<dt>高级会员</dt>
<dd>美文无限看</dd>
<dd>免费大片无限看</dd>
<dd>滨崎步的签名照</dd>
</dl>
```
###表单
- 表单用来收集不同的用户输入,表单由不同的标签组成;
- 一个完整的表单由 "from"标签 和 "表单控件标签"组成
- form标签属性
- action 用来提交表单中用户输入的数据
- method 分为 get | post; 默认就是get
- 以get提交数据, 用户输入的数据会提交到网址后面拼接起来 name属性值=输入值&pwd属性值=123
- get 一目了然少量数据
- 以post提交数据,浏览器看不见提交的内容 比较安全 一般是大量数据
- <label></label> label标签用来 定义文字标注
- <input type = "" name ="" value = ""> 标签用来文本输入的
- input标签属性
- type = "username" 用户名
- type = "password" 密码
- type = "radio" 单选
- type = "checkbox" 多选
- type = "file" 上传文件
- type = "hidden" 隐藏域
- type = "submit" 提交
- type = "reset" 重置
- type = "image" 图片按钮 ,可以获取点击的坐标, 一般不建议使用
- 下拉列表
- "<select>"
- "<optional></optional>"
- "<optional></optional>"
- "<optional></optional>"
- "</select>"
- 文本域
- "<textarea clos = 列数 rows = "行数">"
- "<textarea/>"