cari
Rumahhujung hadapan webhtml tutorialphp学习第一天之HTML篇

2.B/S网络模式(结构)

B/S,browser/Server浏览器/服务器结构。在这种模式下,客户端不需要安装任何的软件(除了浏览器软件),所有的其它的功能都集中到了服务器上。客户端基本上零维护。

image002

image003

3.HTML简介

HTML,HyperText Markup Language超文本标注语言,是SGML的一个应用。是一种标准,一种规范,一种标志(标记)。

比如:北京传智

各种标记的作用:就是告诉浏览器这个内容该如何显示。

image006

静态网页的扩展名:.html   .htm

动态网页(包含服务器端程序)的扩展名:.php  .jsp  .aspx等

 

超文本:是指加了超链接的文本。

 

4.HTML标记的格式

双边标记:内容标记>

举例:广州传智

单边标记:

 

 

一个人有哪些特性:姓名、年龄、学历、毕业院校、身高、体重等

同理:人是一个类别,张三是类别中的一个具体的对象。

 

5.书写HTML标记的规范

1)HTML标记不区分大小写,建议大家使用小写,为了向后兼容。如:

2)一个标记可以有属性,也可以没有属性。如果有属性的话,属性和标记间用空格隔开(至少一个),属性与属性之间用空格隔开。属性必须放在开始标记中,不能放在结束标记中。

比如:

没有属性:

3)属性值一般情况下,都需要加引号(不加也不为错)。

4)HTML的数值属性值,不需要加单位(px),但CSS中的数值的属性值必须要加单位。

HTML中的写法:

CSS中的写法:

5)标记之间可以嵌套,但只能是顺序嵌套,也就是一层套一层,不能交叉嵌套。

6.一个网页的HTML结构

网页标题

网页的主体内容

结构说明:

当浏览器遇到该标记时,就把内容按网页格式来翻译。包含两个子标记:

定义网页文件头信息的,该标记中的内容在浏览器中是不可见,一般起一个特殊的作用。

定义网页的标题的,是的子标记。

是网页的主体内容,网页中99%的内容或标记,都是放在中。中的内容是可见的。

 

7.的常用属性

bgColor:设置网页背景颜色,比如:

background:设置网页的背景图片URL,比如:

 

8.HTML字体修饰标记

加粗    bold

斜体     italic

下划线   underline

删除线   strike

上标

  下标

字体标记

常用的属性

Size:字体大小,取值:1-7,1小7大。

Color:字体颜色,比如:red或RGB(255,0,0)或#FF0000

Face:字体类型,比如:face=“黑体”

举例:内容


水平线,是单边标记

常用的属性:

Size:水平线的粗细

Width:水平线的宽度

Color:水平线的颜色

noshade:纯色显示,不带阴影效果

 

 

9.代码编辑器

1)增强文本编辑器:Editplus  Notepad

特点:软件小、占用系统资源少、语法颜色

缺点:没有代码提示功能

 

 

2)IDE集成开发环境:Zend Studio

特点:软件较大、占用系统资源多、语法颜色、代码提示功能、PHP程序的调试功能、数据库配置等

缺点:收费

 

3)可视化的网页代码编辑工具:Dreamweaver

第一步:创建站点,站点——管理站点

一个站点,就是一个网站,一个网站由多个目录或文件构成。

image008

第二步:设置代码字号大小  CTRL+U  编辑——首选参数——字体

image010

第三步:设置新建网页时的默认编码:CTRL+U  编辑——首选参数——新建文档

image012

UTF-8是多国语言编码,只要你有相应的输入法,就能显示不同国家的语言。

 

 

 

如何保证网页不出现乱码的问题?

1)  你的编辑器的默认编码,要设置为UTF-8

2)  你的HTML代码中,标记,也要设置相应的UTF-8编码

3)  你的PHP网页的编码也要设置为UTF-8

4)  你的MySQL读取的数据编码也要设置为UTF-8

 

第四步:设置DW的默认浏览器:CTRL+U  编辑——首选参数——在浏览器中预览

image014

DOM浏览器,标准浏览器,Firefox浏览器

 

10.网页颜色表示

用英文单词来表示:red  green   blue

用10进制来表示:RGB(255,0,0)  RGB(0,255,0)  RGB(0,0,255)

用16进制来表示:#FF0000      #00FF00       #0000FF

 

RGB色彩模式

自然界中的所有颜色,都可以通过红(R)、绿(G)、蓝(B)三种基色相互混合而成,RGB又叫三原色。

RGB色彩模式,又叫加色模式。任何两种颜色相加,可以产生其它颜色。

在计算机中,每个基色用1个字节来表示(8位二进制,假设如11011011),共可以表示256(0-255个亮度级别)种颜色

RGB共可以混合出多少种颜色? 256 * 256 *256=1677万种色

在网页中的写法:

红色:RGB(255,0,0)

绿色:RGB(0,255,0)

蓝色:RGB(0,0,255)

黄色:RGB(255,255,0)

 

 

二进制:0、1                                                   运算规则:逢二进一

十进制:0、1、2、3、4、5、6、7、8、9                           运算规则:逢十进一

十六进制:0、1、2、3、4、5、6、7、8、9、A、B、C、D、E、F     运算规则:逢十六进一

网页颜色用十六进制表示:

红色:#FF0000       用两位16进制来表示1位10进制

绿色:#00FF00

蓝色:#0000FF

黄色:#FFFF00

 

 

在不同的浏览器下,10进制显示存在不兼容性,最好的是16进制表示方法。

在HTML中10进制表示颜色,没有效果;但在CSS中可以使用10进制表示。

11. image016

12.HTML排版标记

代表一个段落


换行


水平线,noshade属性没有属性值

:一级标题最大

…………

六级标题最小

常用的属性:

align:水平对齐,取值: left、center、right

 

预排版标记,将保留代码所有的空白(连续的空格或换行),换句话说:该标记中的内容会原封不动的输出。

在PHP中输出数组时,用

保留空白输出。

image018

13.

这两个标记,如果单独使用,没有任何效果,一般要结合CSS来使用。

这两个标记,虽然没有任何意义,但在DIV+CSS中又是用的最多的。

相当于两个小的容器,里面用来存放其它内容,方便排版布局。

块元素和行内元素

块元素:单独占取通栏的宽度,前后的元素必须另起一行排版。比如:

行内元素:多个行内元素排在同一行,行内元素没有宽度,宽度是由内容来决定。比如:

 

14.HTML字符实体

      代表一个半角空格

>       大于号

<        小于号

&      &

¥       人民币

©      版权

×      乘号

÷       除号

 

 

15.项目符号标记(无序列表):块元素

  • 内容1
  • 内容2

常用的属性:

Type:项目符号的类型,取值:disc(实心圆点)、circle(小圆圈)、square(小方块)

 

 

16.编号列表(有序列表)

    “a” start=“3”>

      

  •       

  •        ……

    常用的属性:

    Type:编号类型,取值:1(数字)、a、A、i(小罗马)、I(大罗马)

    Start:编号的起始数,该值是一个数字。比如:start=3

     

    转载自—重蔚自留地
  • Kenyataan
    Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
    Apakah tag root dalam dokumen HTML?Apakah tag root dalam dokumen HTML?Apr 29, 2025 am 12:10 AM

    Theroottaginanhtmldocumentis.itservesasthetop-levelementthatencapsulatesallotherContent, memastikanproperdocumentstructureandbrowserparsing.

    Adakah tag dan elemen HTML perkara yang sama?Adakah tag dan elemen HTML perkara yang sama?Apr 28, 2025 pm 05:44 PM

    Artikel ini menerangkan bahawa tag HTML adalah penanda sintaks yang digunakan untuk menentukan unsur -unsur, manakala unsur -unsur adalah unit lengkap termasuk tag dan kandungan. Mereka bekerjasama untuk menyusun laman web.Character Count: 159

    Apakah kepentingan & lt; kepala & gt; dan & lt; body & gt; Tag dalam html?Apakah kepentingan & lt; kepala & gt; dan & lt; body & gt; Tag dalam html?Apr 28, 2025 pm 05:43 PM

    Artikel ini membincangkan peranan & lt; kepala & gt; dan & lt; body & gt; Tag dalam HTML, kesannya terhadap pengalaman pengguna, dan implikasi SEO. Penstrukturan yang betul meningkatkan fungsi laman web dan pengoptimuman enjin carian.

    Apakah perbezaan antara & lt; strong & gt;, & lt; b & gt; tags dan & lt; em & gt;, & lt; i & gt; Tags?Apakah perbezaan antara & lt; strong & gt;, & lt; b & gt; tags dan & lt; em & gt;, & lt; i & gt; Tags?Apr 28, 2025 pm 05:42 PM

    Artikel ini membincangkan perbezaan antara tag HTML ,, dan, memberi tumpuan kepada kegunaan semantik dan presentasi mereka dan kesannya terhadap SEO dan kebolehaksesan.

    Sila jelaskan bagaimana untuk menunjukkan set aksara yang digunakan oleh dokumen dalam HTML?Sila jelaskan bagaimana untuk menunjukkan set aksara yang digunakan oleh dokumen dalam HTML?Apr 28, 2025 pm 05:41 PM

    Artikel membincangkan menentukan pengekodan aksara dalam HTML, memberi tumpuan kepada UTF-8. Isu Utama: Memastikan paparan teks yang betul, menghalang watak -watak yang dihiasi, dan meningkatkan SEO dan kebolehcapaian.

    Apakah pelbagai tag pemformatan dalam html?Apakah pelbagai tag pemformatan dalam html?Apr 28, 2025 pm 05:39 PM

    Artikel ini membincangkan pelbagai tag pemformatan HTML yang digunakan untuk penstrukturan dan gaya web kandungan, menekankan kesannya pada penampilan teks dan kepentingan tag semantik untuk akses dan SEO.

    Apakah perbezaan antara atribut 'ID' dan atribut 'kelas' elemen HTML?Apakah perbezaan antara atribut 'ID' dan atribut 'kelas' elemen HTML?Apr 28, 2025 pm 05:39 PM

    Artikel ini membincangkan perbezaan antara atribut 'ID' dan 'kelas' HTML, yang memberi tumpuan kepada keunikan, tujuan, sintaks CSS, dan kekhususan mereka. Ia menerangkan bagaimana penggunaan penggunaannya mempengaruhi gaya dan fungsi laman web, dan menyediakan amalan terbaik untuk

    Apakah atribut 'kelas' dalam HTML?Apakah atribut 'kelas' dalam HTML?Apr 28, 2025 pm 05:37 PM

    Artikel ini menerangkan peranan atribut kelas HTML 'dalam kumpulan penggabungan untuk gaya dan manipulasi JavaScript, membezakannya dengan atribut' ID 'yang unik.

    See all articles

    Alat AI Hot

    Undresser.AI Undress

    Undresser.AI Undress

    Apl berkuasa AI untuk mencipta foto bogel yang realistik

    AI Clothes Remover

    AI Clothes Remover

    Alat AI dalam talian untuk mengeluarkan pakaian daripada foto.

    Undress AI Tool

    Undress AI Tool

    Gambar buka pakaian secara percuma

    Clothoff.io

    Clothoff.io

    Penyingkiran pakaian AI

    Video Face Swap

    Video Face Swap

    Tukar muka dalam mana-mana video dengan mudah menggunakan alat tukar muka AI percuma kami!

    Alat panas

    Hantar Studio 13.0.1

    Hantar Studio 13.0.1

    Persekitaran pembangunan bersepadu PHP yang berkuasa

    EditPlus versi Cina retak

    EditPlus versi Cina retak

    Saiz kecil, penyerlahan sintaks, tidak menyokong fungsi gesaan kod

    VSCode Windows 64-bit Muat Turun

    VSCode Windows 64-bit Muat Turun

    Editor IDE percuma dan berkuasa yang dilancarkan oleh Microsoft

    SecLists

    SecLists

    SecLists ialah rakan penguji keselamatan muktamad. Ia ialah koleksi pelbagai jenis senarai yang kerap digunakan semasa penilaian keselamatan, semuanya di satu tempat. SecLists membantu menjadikan ujian keselamatan lebih cekap dan produktif dengan menyediakan semua senarai yang mungkin diperlukan oleh penguji keselamatan dengan mudah. Jenis senarai termasuk nama pengguna, kata laluan, URL, muatan kabur, corak data sensitif, cangkerang web dan banyak lagi. Penguji hanya boleh menarik repositori ini ke mesin ujian baharu dan dia akan mempunyai akses kepada setiap jenis senarai yang dia perlukan.

    ZendStudio 13.5.1 Mac

    ZendStudio 13.5.1 Mac

    Persekitaran pembangunan bersepadu PHP yang berkuasa