HTML/CSS基础知识总结

2018-09-03 10:28:51 来源：扬州市新竹网络科技有限公司

在WEB中，HTML和CSS的布局是比不可少的。其中不同标签和属性的使用方法及作用与网站页面紧密关联。
Html页面

<!doctype html><!-- xml xhtml 声明 -->

<html>

<head>

<meta charset="UTF-8"> <!--设置为UTF-8字符集-->

<title>20180810</title> <!--网页标题-->

<!-- 在title内部放入图片 -->

<link rel="shortcut icon" type="image/x-icon" href="images/footlogo.png">

<!-- 链接外部css样式表  外部样式：为了共享 --> 

<link rel="stylesheet" href="css/style.css" type="text/css" >

<style type="text/css">

/* 内部调用CSS样式,只针对当前页面*/

/*tag标签名、id名(名字前面加 #) class名  属性选择器*/

/*标记选择器*/

body{} 

/*属性选择器*/

a[href="https://www.baidu.com/"]{color:red}

/*CSS选择器*/

.top{ 

width:150px;

height:150px;

background-color:#00FFFF;

}

/*ID选择器*/

#one{           

width:100px;

height:100px;

background: pink;

}

a{color:red}

/*派生选择器 根据文档上下文关系来定义样式*/

        div a{color: #000;}

        #one a{}

</style>

</head>

<body><!-- 内联样式 style="background: #F5F5DC;"-->

<img src="" alt="">

<div class="top">

<a href="https://www.baidu.com/">百度</a><!--a链接,链接到百度-->

</div>

<div id="one">

<a href="">新竹网络</a>

</div>

<a href="http://www.xinz56.cn/">新竹网络</a><!--链接到外部文件-->

</body>

</html>

总结：
html是一种描述网页的语言我们称之为超文本标记语言；（它不是编程语言）；
在head内部必须设置编码,一般设置为uft-8，谨防在页面显示的时候出现乱码情况
同时在head内部可以设置链接外部的CSS样式表和title标题img标题图片
标签分为单标签：img meta link
双标签/闭合标签: html head title body style div a
属性选择器
“.” 表示为CSS选择器
“#” 表示为ID选择器
“Body{}”表示为标记选择器（属性选择器）
内部样式：
写在head内部只针对当前页面
外部样式：
外部样式为了共享注释 Hmtl中用
在CSS样式style中 /*注释*/

本站文章均为新竹网站建设摘自权威资料，书籍，或网络原创文章，如有版权纠纷或者违规问题，请即刻联系我们删除，我们欢迎您分享，引用和转载，我们谢绝直接复制和抄袭！感谢...

返回首页上一篇：HTML5常用标签下一篇：没有了