学了4天的前端知识
作者:互联网
标题标签 h1到h6
段落标签 p
换行标签 br
横线 hr
文本格式化标签 粗体 strong
斜体 em
下划线 ins
删除线 del
<img src="" alt="" title="" width="" height="" boder="">
src是图片路径
alt是img标签的文本属性,用于替换文本,图像不能显示的文字
title是img标签的文本属性,提示文本,鼠标放到图片上,显示文字
width是img标签的像素属性,设置图像的宽度
height是img标签的像素属性,设置图像的高度
border是img标签的像素属性,设置图形的边框粗细
图片相对路径 同一级 img
下一级 images/img
上一级 ../img
<a href="跳转目标" target"目标窗口的弹出方式">文本或者图像</a>
target 是指打开方式 _self为默认值 _blank为在新窗口中打开方式
图片链接 <img src="图片地址" alt="">
超链接 <a href="">链接</a>
点击 光标 <label for="">点击</label>
<input type="text,password,radio,submit,checkbox">
<textarea name="" id="" cols="30" rows="10"></textarea>
字体样式
设置字体大小 font-size:50px;
改变字体类型 font-family: '隶书';
改变字体风格 italic斜体 font-style: italic;
改变字体的粗细 bold加粗 lighter变细
由于字体的粗细 有最粗的状态 和 最细的状态 所以值写的很小或者很大的话,不会生效
font-weight: bold;
font是一个复合属性
font: bold italic 50px '隶书' ;
顺序 字体风格 字体粗细 字体大小 字体类型
字体风格 字体粗细 顺序可以互换 其他的不可以
文本样式
设置字体颜色 color:
设置元素水平对齐方式 text-align: center;
设置首行文本的缩进 text-indent: px;
行高的作用在于,行高的大小和高度一致,就可以实现垂直居中 line-height: px;
设置文本的装饰
text-decoration: none;
text-decoration: overline;
在文字的上面加了一条线
text-decoration: underline;
默认的下划线
text-decoration: line-through;
line-through一般用于任务列表
伪类语法
*鼠标指针移动上去的时候会显示什么样式
link visited hover 伪类名
link 没有访问的时候的样式
visited 访问后的样式
hover表示鼠标悬停在文字上显示的样式
active 表示鼠标点击的时候显示的样式
如果想要link生效,href里面的网址需要没有被访问过,不存在于历史记录中
css样式
优先级会受到顺序的影响 所以写样式的顺序 要保持 先外部 再内部 最后内联
外部样式
rel="stylesheet"样式表的意思
链接式导入样式
<link rel="stylesheet" href="./外部样式.css">
内部样式
type="text/css" 表明你写的是一个css样式表
标签:img,样式,text,前端,知识,字体,学了,标签,font 来源: https://blog.csdn.net/qq_45876651/article/details/121431320