网站后台编辑器,wordpress建站详解,微信怎么做网页,网页设计电子版教材今日推荐语 指望别人的救赎#xff0c;势必走向毁灭——波伏娃 日期 学习内容 打卡编号2025年01月17日JavaWeb 前端基础 html CSS018 前言
哈喽#xff0c;我是菜鸟阿康。
今天 正式进入JavaWeb 的学习#xff0c;简单学习 html CSS 这2各前端基础部分势必走向毁灭——波伏娃 日期 学习内容 打卡编号2025年01月17日JavaWeb 前端基础 html CSS018 前言
哈喽我是菜鸟阿康。
今天 正式进入JavaWeb 的学习简单学习 html CSS 这2各前端基础部分以下是我的重点总结希望对你有所帮助。建议先看左侧目录先了解文章结构
请忽略错误的大纲编号我直接从笔记中粘贴过来的就没严格纠正了重点在内容
文末和主页有往期学习笔记大家感兴趣也可以去看下。
继续加油铁铁们 写在开头
前端部分主要是 HTML 和 CSS 而这两个部分对于我们后端开发来说只需要先简单熟悉基础语法即可和前端同学联调不至于很懵。
而这部分的学习主要可以借助 W3school 这个教程网站进行学习可以直接根据案例练习。座椅今天的总结比较简单主要是我个人之前没有太掌握的一些知识。
详细的知识点大家可以去 W3school 官网练习链接如下跳转过去别忘了回来点赞奥~
w3school 在线教程
一、HTML
一概述
HTML 是用来写网页的语言HyperText Markup Language 超文本标记语言。
超文本超越文本的限制还可以去定义音频视频图片....标记语言由标签构成
二W3C
W3C:W3C是万维网联盟,定义了网页由三部分组成
结构HTML 语言基础框架表现CSS 语言控制界面的美观和排版行为JavaScript 语言相当于是方法可以去做一些跳转
三前端学习网站
w3school 在线教程
二、CSS
一CSS 概述
CSS 是一门语言用于控制网页表现。
CSS 指的是层叠样式表* (Cascading Style Sheets)CSS 描述了如何在屏幕、纸张或其他媒体上显示 HTML 元素CSS 节省了大量工作。它可以同时控制多张网页的布局
二快速开始
定义方式
body {background-color: lightblue;
}
定义在 style 中
stylebody{background-color:lightblue;}
/style三CSS 选择器
3.1 元素选择器
元素选择器根据元素名称来选择 HTML 元素
例子:页面上的所有 p 元素都将居中对齐并带有红色文本颜色
p {text-align: center;color: red;
}
3.2 id 选择器
id 选择器使用 HTML 元素的 id 属性来选择特定元素
id 必须是唯一的
要选择具有特定 id 的元素请写一个井号后跟该元素的 id
注意id 不能以数字开头
例子这条 CSS 规则将应用于 idpara1 的 HTML 元素
#para1 {text-align: center;color: red;
}
3.3 类选择器
类选择器选择有特定 class 属性的 HTML 元素
如需选择拥有特定 class 的元素请写一个句点.字符后面跟类名。
例子所有带有 classcenter 的 HTML 元素将为红色且居中对齐
.center {text-align: center;color: red;
}
注意定只有特定的 HTML 元素会受类的影响(元素名称.className)
p.center {text-align: center;color: red;
}
3.4 通用选择器
通用选择器*选择页面上的所有的 HTML 元素。
例子CSS 规则会影响页面上的每个 HTML 元素
* {text-align: center;color: blue;
}
四导入CSS
4.1 外部 CSS 前提是定义一个外部样式表每张 HTML 页面必须在 head 部分的 元素内包含对外部样式表文件的引用注意relstylesheet 为固定格式
link relstylesheet hrefmy.css
4.2 内部 CSS 如果一张 HTML 页面拥有唯一的样式那么可以使用内部样式表内部样式是在 head 部分的
stylebody {background-color: linen;}h1 {color: maroon;margin-left: 40px;}
/style4.3 行内 CSS 行内样式也称内联样式可用于为单个元素应用唯一的样式如需使用行内样式请将 style 属性添加到相关元素。style 属性可包含任何 CSS 属性实例行内样式在相关元素的 style 属性中定义
h1 stylecolor:blue;text-align:center;This is a heading/h1p stylecolor:red;This is a paragraph./p4.4 层叠顺序
行内样式在 HTML 元素中外部和内部样式表在 head 部分浏览器默认样式
交流群
最近一些朋友咨询我说我是怎么坚持的。
其实呢我之前也自学过1年时间 java 但是放弃了最后到其他行业去体验一下之后又想回 IT 岗但是还是出现三天打鱼两天晒网的情况后边我尝试通过打卡的形式来督促自己目前看来还有一定效果。
但是更多时候我发现我自己是孤军奋战有时候难免乏力没有同行的人相信也有部分朋友和我一样想学习但是难于坚持所以为什么不抱团取暖呢
于是我建了个上岸鼓励群欢迎大家互相鼓励找到自己的学习搭子
QQ裙耳薇码如下感兴趣的同学入期待相遇~ 往期笔记【文末福利】
SQL优化的7个方向慢查询从这里排查就好了-CSDN博客
