分享web开发知识

注册/登录|最近发布|今日推荐

主页 IT知识网页技术软件开发前端开发代码编程运营维护技术分享教程案例
当前位置:首页 > 代码编程

html_css总结

发布时间:2023-09-06 02:08责任编辑:郭大石关键词:暂无标签
HTML:超文本标记语言
web应用(crm)

HTML有且只有一个HTML根标签。
HEAD标签代表文件头。
BODY标签代表网页主体。

如何编写HTML?
HTML文件的后缀名.html。

常用标签:
基本标签:
??HTML
??HEAD
??BODY
??HR: 分割线
??BR:换行
??PRE: 原样输出
??H1~H6:标题
??
格式化标签:
??SUB: 下标
??SUP:上标
??
字体标签:
??<font>
??<strong>:加重点
??<b>:加粗
??<i>:斜体

列表标签:
??ol和li:有序列表
??ul和li:无序列表
??dl、dt和dd:定义列表
??
超链接标签:a
??1)链接其他资源;
??2)锚点定位;
??3)当做一个按钮使用;
??
??href:
?????1)如果是http协议,那么浏览器就会启用http解析器解析网页内容;
?????2)如果没有任何协议,默认就是file协议;
?????3)如果是其他协议(mailto、javascript),浏览器就会查询注册表是否存在处理该协议的软件
?????。如果有就启用该软件处理协议。
??target:指定资源的打开方式。
?????_self: 在当前窗口中打开资源;
?????_blank: 在新窗口中打开资源;
?????framename: 在指定框架中打开资源;
?????
图像标签:img
??src:指定图片资源的路径
??alt:指定可替换文本
??
表格标签:
??<table>:定义一个表格
?????<caption>:表格标题
?????<tr>: 定义一行
????????<td>: 定义单元格
????????<th>:定义标题的单元格
?????<thead>:表格头,可以没有
?????<tbody>:表格主体,至少出现一次
?????<tfoot>:表格底部,可以没有
?????
??表格相关的属性:
?????border:定义表格边框
?????width: 定义表格的宽度
?????height: 定义表格的最小高度
?????cellspacing: 指定单元格之间的间隔
?????align: 表格的对齐方式,例如:居中center、左对齐left、右对齐right、两边对齐justify;
?????
??指定行或列的对齐方式:
?????align: 表格的对齐方式,如果放在tr标签中,那么该行中所有单元格都有效;
?????如果放在td标签中,那么只对该单元格有效;
??
框架标签:把一个网页切割成不同部分,每一个部分都是一个框架。
??frameset:框架集,负责把页面中所有框架包含起来;
?????cols: 指定每一个框架的宽度(垂直排列);
?????rows: 指定每一个frame的高度(水平排列);
??frame:框架,一个框架代表一个页面;
??
??注意:frameset不能够与body同时存在。
??
?????

??
CSS: 层叠样式单,美化网页。
??编写方式:1)在style标签中编写CSS;2)在外部的CSS文件中编写CSS,然后把CSS文件引入到HTML页面;
?????3)在HTML元素中定义style属性(优先级最高);

??选择器:标签选择器、类选择器、ID选择器、伪类选择器、通用选择器、交集选择器、并集选择器。
??CSS样式:
?????1)背景样式:
????????background-color: 背景色
????????background-image: 背景图
????????background-repeat:no-repeat 不平铺
????????background-position:背景图的位置
????????background-attachment: fixed ?固定背景图

?????2)字体和文本样式:
????????font-size: 字体的大小
????????color: 字体的颜色
????????text-indent: 文本缩进
????????text-decoration: 修饰文本
????????text-align: 文本对齐方式
????????text-transform: 转换大小写

?????3)表格样式:
????????border-collapse: 合并单元格的边框;
????????border-spacing:设置单元格边框的距离;

?????4)边框样式:设置元素边框的宽度、颜色和风格。
????????border-开头

?????5)盒子模型:设置元素的内边距和外边距。
????????内边距:元素内容与边框的距离;
???????????注意:元素实际宽度=元素的width + 左右padding
??????????????元素的实际高度=元素的height + 上下padding
????????外边距:元素边框以外的部分;
???????????margin-left:-10px

?????6)定位:
????????相对定位:相对于元素原先位置的定位;
????????绝对定位:相对于屏幕的位置而言;
????????固定定位:跟绝对定位一样,但是不会随着屏幕滚动而滚动;
???????????postion:relative|absolute|fixed
???????????left:元素左上角的横坐标
???????????top:元素左上角的纵坐标

????????浮动定位:
???????????float:设置向哪个方向浮动;

html_css总结

原文地址:https://www.cnblogs.com/iam-ironman/p/10549394.html

知识推荐

我的编程学习网——分享web前端后端开发技术知识。 垃圾信息处理邮箱 tousu563@163.com 网站地图
icp备案号 闽ICP备2023006418号-8 不良信息举报平台 互联网安全管理备案 Copyright 2023 www.wodecom.cn All Rights Reserved