html网页设计同字,Html前端网页设计-CSDN博客

HTML网页设计

第一天：初识HTML

(标题部分) 主体部分

认识HBuilder软件

快捷键

ctrl+/ 注释代码

ctrl+y 恢复撤销

ctrl+x 剪切

ctrl+z 撤销

ctrl+c 复制

ctrl+p 在当前项目查找文件

ctrl+f 在当前文件查找字符串

ctrl+alt+f 在当前目录查找字符串

ctrl+k 格式化代码

ctrl+g 跳转到某行代码

ctrl+o 打开文件

ctrl+alt+s 保存所有文件

鼠标左键+ctrl选中多行(可进行多行修改操作)

一、内部包含的部件

1、标题标签

例：

(内容) 双标签

改变文字大小，从大到小，黑体加粗

标签只许到6，7以后都是普通文字样式

2、段落、换行、注释

(1)段落

(内容) 双标签

代表段落文字标签

(2)水平线标签

可插入水平分割线

(3)换行

使段落文字换行

(4)居中

(内容) 双标签

(5)注释

或快捷键

3、格式元素

普通文本格式

粗体文本：

东软睿道

大号字：

东软睿道

大号字：

东软睿道

着重文字：

东软睿道

斜体字：

东软睿道

小号字：

东软睿道

加重语气：

东软睿道

下标字：

东软睿道

上标字：

东软睿道

插入字：

东软睿道

删除字：

东软睿道

4、插入图片元素

path

src代表图像地址

alt代表图像的替代文字

title代表鼠标悬停时提示文字

width和height代表宽度和高度

5、列表

(1)无序列表

(2)有序列表

(3)定义列表definition list 第二天 CSS用于网页设计中字体、位置、颜色的设置一、CSS样式表单 (1)外部引用样式 href代表文件路径 rel代表使用外部样式表 type代表文件类型 (2)内部样式 css代码写在三、CSS文本属性 1、font-family 字体样式 2、font-size 字体大小 3、font-weight 字体加粗 4、四、无语意元素 1、无语意标签 (1)

内联标签，可句中单独调用 (2)

块级标签五、用来设置板块 #代表id . 代表class #top 代表

.top 代表

六、背景设置 background-color 元素背景颜色 background-image 元素背景图片引用方法 background-rapeat 设置背景图片水平或垂直平铺 background-position 设置背景图片起始位置七、文本样式 color 设置文本颜色 line-height 设置行间距离行高 text-align 设置文本的对齐方式八、 list-style:none; /* 列表样式,去掉前面的圈 */ margin:0px;/* 去标头空白 */

/* 鼠标悬停时效果改变 /

#aaa li:hover{

background-color: darksalmon;

font-size: 18px;

color:aqua;

}

float: left;/ 浮动操作 /可进行横向排列

float:left;/ 浮动效果,让竖着的文字浮动变为一行 */

padding-left: 40px; 代表顶出的距离

margin-top 代表距离顶部的间距

margin-right: auto; /* auto为自动调节位置 */

border-radius:10px; /* 边框圆角程度 */