常用的HTML标签及样式

最新推荐文章于 2023-05-07 23:36:37 发布

开水煮酒

最新推荐文章于 2023-05-07 23:36:37 发布

阅读量415

点赞数

分类专栏： HTML 文章标签： HTML CSS

本文链接：https://blog.csdn.net/weixin_43996165/article/details/84860892

版权

HTML 专栏收录该内容

3 篇文章 0 订阅

订阅专栏

一些常用的HTML标签及及样式

<html></html>
<head></head>头部标签
<link rel=”stylesheet” href=””>           /*链接css*/
<body></body>主体标签

<form action=”” method=”post”></form>      /*表单元素*/

**input标签：**
<input  type=”text” >                /*表单*/
<input  type=”pawssod” >               /*表单密码*/ 
<button type="button" class=""></button>         /*按钮*/
<input  type=”submit” >  				/*按钮*/
<input  type=”email” > 					/*邮件验证表单*/
<input  type=”url” > 					/*url验证表单*/
<input  type=”url” > 					/*url验证表单*/
<input  type=”date” > 					/*日期选择器*/

**h5视频及音频标签：**
<Video src=”url” controls=”controls” loop=”loop” autoplay=”autoplay”></Video>	/*视频元素*/
<audio src=”url” controls=”controls” loop=”loop” autoplay=”autoplay”></audio>/*音频元素*/
Controls=添加播放/暂停插件
loop=循环播放
autoplay=自动播放

**定义框架结构的标签：**
<frameset>							
<frame  src=”url.html”></frame>
</frameset>
Rows:定义每行占屏幕面积
Cols:定义每列占屏幕面积
Noresize:使框架边框不可拉动	

**定义内联框架标签：**
<iframe  src=”url.html” ></iframe>   
frameborder=”0”   /*去除框架边框*/
Scrolling=”yes/no”  /*框架内是否显示滚动条*/


## css样式

关于在element.style的样式修改：添加!important
例：width: 100%!important;

background-image: url ( );        /*背景图片*/
background-repeat:no-repeat;      /*去掉重复图像*/
Background-position:center  top;  /*背景的位置：水平居中*/
background:-webkit-linear-gradient(bottom, #054679, #1476c3)   /*背景色渐变（上到下)*/
width:10 px;                      /*宽度*/
height:0px;                       /*高度*/  
margin:0  auto;                   /*居中，上 右 下 左*/
text-decoration:none;             /*无下划线*/
Padding:0 px;                     /*左 右 上 下*/
List-style:none;                  /*去掉项目前的圆点*/
display:inline;                   /*成一行显示*/
position: fixed;				/*导航栏随滚动条移动：*/    

文本样式：
Direction:rtl;		设置文本方向
Line-height:		设置行高
Letter-spacing:	设置字符间距
word-spacing：	设置字间距
text-indent：	缩进首行文本
text-decoration:	向文本添加修饰
text-align:		对齐元素中的文本
text-transform:	控制元素中的字母

列表样式：
list-style-type：属性设置列表项标记的类型
list-style-image：属性使用图像来替换列表项的标记
list-style:复合写法

表格样式：
border-style:设置边框样式
border-collapse：是否将表格边框折叠为单一边框
border-spacing：设置相邻单元格的边框间的距离
caption-side:设置表格标题的位置
text-align:设置文本水平对齐方式
vertical-align:设置文本垂直对齐方式

伪元素：
:before	该伪元素定义在元素之前添加内容
:after	该伪元素定义在元素之后添加内容
:first-line	该伪元素向文本的首行添加特殊样式
:first-letter	该伪元素向文本的第一个字母添加特殊样式

<font>
font-family:’华文琥珀’；           /*字体风格*/
font-size:16px;                   /*字体大小*/
font-weight:bold;                 /*文字粗细*/
font-style:                       /*斜体风格*/
clear:both;                       /*清除浮动*/
overflow:visible;                 /*超出范围如何显示 hidden*/
border:10px  solid green;         /*宽度  实线  下*/

开水煮酒

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
常用的HTML标签及样式

&lt;html&gt;元素&lt;head&gt;元素&lt;link rel=”stylesheet” href=””&gt; /*链接css*/&lt;body&gt;元素&lt;form action=”” method=”post”&gt;&lt;/form&gt; /*表单元素*/&lt;input&gt;&
复制链接

扫一扫

专栏目录