목차
回复内容:
백엔드 개발 PHP 튜토리얼 javascript - 如何在手机上的HTML如何排版成如下格式???

javascript - 如何在手机上的HTML如何排版成如下格式???

Jul 06, 2016 pm 01:51 PM
css html html5 javascript php

javascript - 如何在手机上的HTML如何排版成如下格式???

javascript - 如何在手机上的HTML如何排版成如下格式???

这种两行数据都是从数据库一个数组取出的,HTML如何写啊???本人小白求大神指导

回复内容:

javascript - 如何在手机上的HTML如何排版成如下格式???

javascript - 如何在手机上的HTML如何排版成如下格式???

这种两行数据都是从数据库一个数组取出的,HTML如何写啊???本人小白求大神指导

建议去了解一下CSS3的Flex布局
http://www.ruanyifeng.com/blog/2015/07/flex-grammar.html?utm_source=tuicool

Bootstrap中的解决方案

1.移动端的话建议用flex布局,新旧语法一起用,兼容性没啥问题
2.display:inline-block;width:50%;这个会有空格问题,要把父元素的font-size设为0
3.不建议用浮动,因为如果不定高的话,当两边高度不同时布局会乱

用bootstrap吧,能实现你需要的响应式布局,http://www.runoob.com/bootstrap/bootstrap-tutorial.html。
不过更建议你用Webapp框架,跟你说几个常见的Webapp框架吧:
1、jQuery Mobile:学习成本低,效率低,跨浏览器兼容性最好;
2、Zepto:Zepto就是一个jQuery的轻量级替代品,效率比jQuery高,有jQuery的缺点;
3、ionic:基于AngularJs做的,学习成本高,效率高;
4、Sencha Touch:是世界上第一个支持 HTML5 和 CSS3 标准的移动应用框架

float:left;width:50%

float:left;width:50%

每一块给宽度50% 让后浮动,要注意设置box-size 为border-box

谢谢大家的帮助,我会去试试的,做不出来再来问大家

본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.

핫 AI 도구

Undresser.AI Undress

Undresser.AI Undress

사실적인 누드 사진을 만들기 위한 AI 기반 앱

AI Clothes Remover

AI Clothes Remover

사진에서 옷을 제거하는 온라인 AI 도구입니다.

Undress AI Tool

Undress AI Tool

무료로 이미지를 벗다

Clothoff.io

Clothoff.io

AI 옷 제거제

Video Face Swap

Video Face Swap

완전히 무료인 AI 얼굴 교환 도구를 사용하여 모든 비디오의 얼굴을 쉽게 바꾸세요!

인기 기사

<gum> : Bubble Gum Simulator Infinity- 로얄 키를 얻고 사용하는 방법
1 몇 달 전 By 尊渡假赌尊渡假赌尊渡假赌
Nordhold : Fusion System, 설명
1 몇 달 전 By 尊渡假赌尊渡假赌尊渡假赌
Mandragora : 마녀 트리의 속삭임 - Grappling Hook 잠금 해제 방법
4 몇 주 전 By 尊渡假赌尊渡假赌尊渡假赌

뜨거운 도구

메모장++7.3.1

메모장++7.3.1

사용하기 쉬운 무료 코드 편집기

SublimeText3 중국어 버전

SublimeText3 중국어 버전

중국어 버전, 사용하기 매우 쉽습니다.

스튜디오 13.0.1 보내기

스튜디오 13.0.1 보내기

강력한 PHP 통합 개발 환경

드림위버 CS6

드림위버 CS6

시각적 웹 개발 도구

SublimeText3 Mac 버전

SublimeText3 Mac 버전

신 수준의 코드 편집 소프트웨어(SublimeText3)

PHP 성능 최적화 전략. PHP 성능 최적화 전략. May 13, 2025 am 12:06 AM

phPapplicationSCanBeoptimizedForsPeedandefficiencyby : 1) ENABLEOPCACHEINPHP.INI, 2) PREPAREDSTATEMENTSWITHPDOFORDATABASEQUERIES 사용

PHP의 종속성 주입을위한 모범 사례 PHP의 종속성 주입을위한 모범 사례 May 08, 2025 am 12:21 AM

의존성 주입 (DI)을 사용하는 이유는 코드의 느슨한 커플 링, 테스트 가능성 및 유지 관리 가능성을 촉진하기 때문입니다. 1) 생성자를 사용하여 종속성을 주입하고, 2) 서비스 로케이터 사용을 피하고, 3) 종속성 주입 컨테이너를 사용하여 종속성을 관리하고, 4) 주입 종속성을 통한 테스트 가능성을 향상 시키십시오.

phpmyadmin의 기능 : MySQL과 상호 작용 (SQL) phpmyadmin의 기능 : MySQL과 상호 작용 (SQL) May 07, 2025 am 12:16 AM

Phpmyadmin은 웹 인터페이스를 통해 MySQL 데이터베이스 관리를 단순화합니다. 1) 데이터베이스 및 테이블 작성 : 그래픽 인터페이스를 사용하여 쉽게 작동합니다. 2) 복잡한 쿼리 실행 : SQL 편집기를 통해 구현 된 Join Query와 같은 실행. 3) 최적화 및 모범 사례 : SQL 쿼리 최적화, 인덱스 관리 및 데이터 백업 포함.

PHP 성능 최적화 점검표 : 지금 속도를 향상시킵니다 PHP 성능 최적화 점검표 : 지금 속도를 향상시킵니다 May 12, 2025 am 12:07 AM

toImprovePhPapplicationSpeed, followthesesteps : 1) enableOpCodeCachingWithApcuTeCeScripteXecutionTime.2) 구현 구현

PHP 이메일 검증 : 이메일이 올바르게 전송되도록합니다 PHP 이메일 검증 : 이메일이 올바르게 전송되도록합니다 May 13, 2025 am 12:06 AM

phpeMailValidationInvoLvestHreesteps : 1) formatValidationUsingRegularexpressionsTochemailformat; 2) dnsValidationToErethedomainHasaValidMxRecord; 3) smtpvalidation, theSTHOROUGHMETHOD, theCheckSiftheCefTHECCECKSOCCONNECTERTETETETETETETWERTETWERTETWER

html in Action : 웹 사이트 구조의 예 html in Action : 웹 사이트 구조의 예 May 05, 2025 am 12:03 AM

HTML은 명확한 구조를 가진 웹 사이트를 구축하는 데 사용됩니다. 1) 태그를 사용하여 웹 사이트 구조를 정의하십시오. 2) 예는 블로그 및 전자 상거래 웹 사이트의 구조를 보여줍니다. 3) 잘못된 레이블 중첩과 같은 일반적인 실수를 피하십시오. 4) HTTP 요청을 줄이고 시맨틱 태그를 사용하여 성능을 최적화합니다.

PHP 의존성 주입 컨테이너 : 빠른 시작 PHP 의존성 주입 컨테이너 : 빠른 시작 May 13, 2025 am 12:11 AM

aphpdectionenceindectioncontainerisatoolthatmanagesclassdependencies, 향상 Codemodularity, testability 및 maintainability.itactAsacentralHubForCreatingAndingDinjectingDingingDingingdecting.

최고의 PHP 성능 최적화 기술 최고의 PHP 성능 최적화 기술 May 07, 2025 pm 03:05 PM

PHP 성능 최적화는 다음 단계를 통해 달성 할 수 있습니다. 1) 스크립트 상단에 require_once 또는 include_once를 사용하여 파일로드 수를 줄입니다. 2) 데이터베이스 쿼리 수를 줄이기 위해 전처리 문 및 배치 처리를 사용하십시오. 3) Opcode 캐시에 대한 Opcache 구성; 4) PHP-FPM 최적화 프로세스 관리를 활성화하고 구성합니다. 5) CDN을 사용하여 정적 자원을 배포합니다. 6) 코드 성능 분석을 위해 Xdebug 또는 Blackfire를 사용하십시오. 7) 배열과 같은 효율적인 데이터 구조를 선택하십시오. 8) 최적화 실행을위한 모듈 식 코드를 작성하십시오.

See all articles